Question

我正在尝试通过播放视频或在播放视频之前在HTML5中获取视频时长，就像您在视频管或任何其他视频网站上看到的一样。

任何帮助都会非常感激。

先谢谢。

Answer 1

对于HTML5，您应该能够在加载文件的元数据后使用视频标记的持续时间属性。请参阅此答案以获得一个好方法：

引用Mikushi的anwser：

myVideoPlayer.addEventListener('loadedmetadata', function() {
    console.log(videoPlayer.duration);
});

通过侦听'loadedmetadata'事件，您将确保已加载持续时间值。

有关loadedmetadata的更多详细信息，请访问：http://www.w3schools.com/tags/av_event_loadedmetadata.asp

Answer 2

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script type="text/javascript">
        function getDuration() {
            var s = document.getElementById('a');
            alert(s.duration)
        }
    </script>
</head>
<body>
<div>
    <video src="2.mp4" id="a" controls="controls"></video>
    <button onclick="getDuration()">get duration</button>
</div>
</body>

</html>

Answer 3

在视频元素上触发了一个名为“loadedmetadata”的特殊事件。触发此项后，视频元素上将显示持续时间等属性。

以下是所有HTML5视频事件的详尽列表：http://www.w3.org/2010/05/video/mediaevents.html

Answer 4

// Assume "video" is the video node
var i = setInterval(function() {
    if(video.readyState > 0) {
        var minutes = parseInt(video.duration / 60, 10);
        var seconds = video.duration % 60;

        // (Put the minutes and seconds in the display)

        clearInterval(i);
    }
}, 200);

HTML5视频时长，无需播放视频

4 个答案: