HTML 音频/视频 DOM timeupdate 事件

// 获取 id="myVideo" 的<video> 元素
let vid = document.getElementById("myVideo");

// 将 ontimeupdate 事件分配给<video> 元素，并在当前播放位置发生变化时执行一个函数
vid.ontimeupdate = function() {myFunction()};

 
function myFunction() {
// 在 id="demo" 的<p> 元素中显示视频的当前位置
    document.getElementById("demo").innerHTML = vid.currentTime;
}

更多“自己尝试”的例子见下文。

定义和用法

当音频/视频的播放位置发生变化时，会触发 timeupdate 事件。

此事件由以下操作触发：

• 播放音频/视频
• 移动播放位置（例如，当用户快进到音频/视频的另一点时）

提示： timeupdate 事件通常与 Audio/Video 对象的 currentTime 属性一起使用，该属性以秒为单位返回音频/视频播放的当前位置。

浏览器支持

表格中的数字指定了完全支持该事件的第一个浏览器版本。

语法

在 HTML 中

在 JavaScript 中

在 JavaScript 中，使用 addEventListener() 方法

技术详情

更多实例

// 获取 id="myVideo" 的<audio> 元素
let aud = document.getElementById("myVideo");

// 将 ontimeupdate 事件分配给<audio> 元素，并在当前播放位置发生变化时执行一个函数
aud.ontimeupdate = function() {myFunction()};

 
function myFunction() {
// 在 id="demo" 的<p> 元素中显示音频的当前位置
    document.getElementById("demo").innerHTML = aud.currentTime;
}

document.getElementById("myVideo").currentTime = 5;