Versuchen, volle Videodauer zu erhalten, aber als Nan

Question

Ich versuche, die Videodauer von meinem Player zu bekommen, aber es gibt NaN zurück, ich bin nicht ganz sicher, wie man von hier aus darauf zugreifen.

<video id="videoPlayerNew" class="video-js vjs-default-skin vjs-controls-enabled" poster="http://camendesign.com/code/video_for_everybody/poster.jpg" data-setup="{}" controls=""> 
    <source src="sample.mp4" type="video/mp4"> 
    <p class="vjs-no-js">Javascript was disabled or not supported</p> 
</video> 

<script> 
    var vid = document.getElementById("videoPlayerNew"); 
    console.log(vid.duration); 
</script> 

Das Protokoll sagt mir: NaN

Answer 1

Warten Sie onloadedmetadata Ereignis!

var vid = document.getElementById("videoPlayerNew"); 
 
vid.onloadedmetadata = function() { 
 
    console.log('metadata loaded!'); 
 
    console.log(vid.duration); 
 
};

<video id="videoPlayerNew" class="video-js vjs-default-skin vjs-controls-enabled" poster="http://camendesign.com/code/video_for_everybody/poster.jpg" data-setup="{}" controls=""> 
 
    <source src="http://www.w3schools.com/html/mov_bbb.mp4" type="video/mp4"> 
 
    <p class="vjs-no-js">Javascript was disabled or not supported</p> 
 
</video> 
 

 
<script> 
 
</script>

Answer 2

Sie müssen so etwas wie Onchange verwenden. Versuchen Sie den Code unten:

$(document).ready(function(){ 
    $("#videoPlayerNew").on("timeupdate", function(event){ 
     console.log(this.duration); 
    }); 
)};