您的位置:首页 > Web前端 > HTML5

HTML5事件监听

2016-05-10 19:00 176 查看
<!doctype html>

<html>

<head>

<meta charset="utf-8">

<title>无标题文档</title>

<script>

function playorpausevideo()

{
var videourl=document.getElementById("videourl").value;
var video=document.getElementById("video");
video.addEventListener("timeupdate",function()
{
var timedisplay=document.getElementById("time");
timedisplay.innerHTML=Math.floor(video.currentTime)+"/"+Math.floor(video.duration)+"秒";
},false
);
if(video.paused)
{
if(videourl!=video.src)
{
video.src=videourl;
video.load();
}
else
{
video.play();
}
document.getElementById("playbutton").value="播放";
}
else
{
video.pause();
document.getElementById("playbutton").value="暂停";
}

}

</script>

</head>

<body>

<video id="video" src="mov_bbb.mp4" width="400px" autoplay loop>

</video><br />

视频地址:<input type="text" id="videourl" />

<input id="playbutton" type="button" onClick="playorpausevideo()" value="播放" />

<span id="time"></span>

</body>

</html>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: