我正在尝试获取播放器的视频时长但返回NaN
,我不完全确定如何从此处访问它。
<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>
日志告诉我:NaN
答案 0 :(得分:6)
等待onloadedmetadata
事件!
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>
答案 1 :(得分:3)
尝试下面的代码,它会在加载完所有内容后添加事件:
$(document).ready(function(){
$("#videoPlayerNew").on( "timeupdate", function(event){
console.log( this.duration);
});
});