限制 HTML5 视频循环的数量

Question

:) 我试图将 HTML5 视频仅循环播放 3 次。我找到了片段，它基本上可以做我想做的事。奇怪的是，我无法让它工作。如果我运行 Whosebug 上的演示可以正常工作。如果我将其复制并粘贴到空白 html 文档中，它不会。有什么建议吗？

谢谢！

Answer 1

你们在正文部分末尾添加了JS脚本吗？应在主体部分末尾添加脚本（加载文档时）。

Answer 2

试试复制粘贴这个。这应该有效。

<div>Iteration: <span id="iteration"></span></div>

<video width="320" height="240" id="myVideo" controls>
    <source src="http://clips.vorwaerts-gmbh.de/big_buck_bunny.mp4" type="video/mp4" />
    <source src="http://clips.vorwaerts-gmbh.de/big_buck_bunny.ogv" type="video/ogg" />
    Your browser does not support the video tag.
</video>

<script>
    var iterations = 1;

    document.getElementById('iteration').innerText = iterations;

    myVideo.addEventListener('ended', function () {    

        if (iterations < 2) {
            this.currentTime = 0;
            this.play();
            iterations ++;          
            document.getElementById('iteration').innerText = iterations;
        }   

    }, false);
</script>

限制 HTML5 视频循环的数量

Limit the Number of HTML5 Video Loops

html

javascript

video

loops

limit