以下是一个简单的例子,演示如何使用 ondurationchange 事件:
<!DOCTYPE html>
<html>
<head>
<title>ondurationchange Event Example</title>
</head>
<body>
<video id="myVideo" width="640" height="360" controls ondurationchange="handleDurationChange()">
<source src="example.mp4" type="video/mp4">
Your browser does not support the video tag.
</video>
<script>
// 处理媒体持续时间变化事件
function handleDurationChange() {
var video = document.getElementById("myVideo");
var duration = video.duration;
alert("Media duration has changed to: " + duration + " seconds");
}
</script>
</body>
</html>
在这个例子中,<video> 元素附加了 ondurationchange 事件,并调用了 handleDurationChange 函数。在函数中,我们通过 video.duration 获取媒体的持续时间,并使用 alert 弹出一个消息,指示媒体的持续时间发生了变化。
这个事件通常在媒体的元数据加载完成后触发,或者在切换到不同的媒体源时触发。你可以利用这个事件来执行与媒体持续时间相关的操作。
转载请注明出处:http://www.pingtaimeng.com/article/detail/6244/JavaScript 和 HTML DOM