使用onTimeUpdate事件可以实时监测视频播放中时间信息。使用video.duration获取视频播放总时长。使用video.currentTime可以获取当前已播放时长。
【示例】
-
HTML
<fieldset> <legend>timeupdate事件应用</legend> <video id="myVideo" controls src="../video/4_1.mp4" onTimeUpdate="update()"></video> <br> <span id="result"></span> </fieldset>
-
JS
function update() { var video = document.getElementById("myVideo"); var result = document.getElementById("result"); var duration = video.duration; //获取视频播放总时长 var currentTime = video.currentTime; //获取当前已播放时长 result.innerHTML = Math.floor(currentTime) + " / " + Math.floor(duration)+" (秒)" }