Question

我有html代码，如下所示

<div id="#p0">
<div style="width:1320px;height:1080px;position:absolute;left:0px;top:0px;z-index:0;">
    <video preload="auto" autoplay>
            <source src="1.mp4" type="video/mp4">
            <source src="1.ogv" type="video/ogg">
    </video>
</div>
<div style="width:600px;height:1080px;position:absolute;left:1321px;top:0px;z-index:0;">
    <video preload="auto" autoplay>
            <source src="2.mp4" type="video/mp4">
            <source src="2.ogv" type="video/ogg">
    </video>
</div>
<div style="width:1000px;height:600px;position:absolute;left:200px;top:200px;z-index:5;">
    <video preload="auto" autoplay>
            <source src="3.mp4" type="video/mp4">
            <source src="3.ogv" type="video/ogg">
    </video>
</div>
</div>

我第一次创建视频标签并附加到主div但是从下一个开始我只是使用display show hide播放视频，但我希望每次都能获得视频的持续时间，但是下面的代码只调用一次。

this.addEventListener('loadeddata', function(e) {
        e.target.duration
   });

Answer 1

在纯JavaScript中，这并不容易，因为根据定义，.loadeddata在用户代理中运行一次......

由于我可以看到您有“jQuery - 标记”您的问题，我建议您使用这段代码

 var video = $('#videoID')[0];
  video.onloaddata = function(e) { /* your code here*/ };

瞧！

HTML5视频标记重播事件

1 个答案: