如何在html5视频播放器中获取视频的持续时间？

Question

嗨，我正在使用html5视频播放器，我想在播放列表数组中获取每个视频的持续时间。 下面是我正在使用的代码，但它在控制台中显示了NaN。 请帮助我...谢谢大家的先进。

        $.each(self._playlist.videos_array, function(key ) {
        if(1) {
            self.dummy_video = $("<video />");  
            console.log(self._playlist.videos_array[key].Levels[0].mp4);
            self.dummy_video.attr('src', self._playlist.videos_array[key].Levels[0].mp4);
            //self.dummy_video.load();
            //self.dummy_video[0].play();
             //self.dummy_video[0].pause();         
             var video = self.dummy_video.get(0);
             console.log(video.duration);               
        }           
      });   

Answer 1

有两种解决方法：

使用setInterval： 检索HTML5视频持续时间时出现问题

使用事件： html5视频的当前/持续时间？

Answer 2

来自W3C＃mediaevents ：

事件loadedmetadata的描述：

用户代理刚刚确定了媒体资源的持续时间和尺寸，并且文本轨道已准备就绪。

您可以收听该事件，在此之前，视频的持续时间为NaN 。

下面的演示：

 $(function() { var video = $("<video>"); video[0].addEventListener("loadedmetadata", function() { // Here you will get a valid duration now. console.log("Video duration now: " + video[0].duration); }); video.attr("controls", "controls").attr("src", "https://avvimeo-a.akamaihd.net/68093/485/101309641.mp4?token2=1436525964_a8966f84e4a514fdb7a406a9ee6f1e30&amp;aksessionid=6475e4121b60d4cf"); video.appendTo($("#playblock")); // Here's the position of your console.log, it'll put NaN here. console.log("Video duration now: " + video[0].duration); }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> <div id="playblock"></div>