如何在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>