如何获取动态加载的HTML5视频的持续时间?

时间:2017-01-19 06:19:40

标签: javascript jquery html5 video

我正在使用Ooyala脚本加载HTML5视频并尝试获取视频的持续时间值。我收到此错误“无法读取未定义的属性'addEventListener'”。这是我的代码:

var video = jQuery('.video-element').get(0);
video.addEventListener('loadedmetadata', function () {
    var minutes = parseInt(video.duration / 60, 10);
    var seconds = parseInt(video.duration % 60);
    var secondsnew = ("0" + seconds).slice(-2);

    console.log(minutes+":"+secondsnew);
});

我认为这是因为视频是动态加载的,因为我已经使用已经加载到DOM中的本机视频进行了测试并且它有效。如何使用动态加载的视频进行此操作?

1 个答案:

答案 0 :(得分:1)

我不确定如何使用 Ooyala 脚本访问它,但只需HTML5视频就可以js使用视频ID进行访问

$(document).ready(function () {
    var videoDuration =  document.getElementById('Sample')
    var duration = videoDuration.duration;
    alert(duration);
};

HTML

<video src="video.mp4" id="Sample" controls>
      video not supported
</video>