【问题标题】:Limit the Number of HTML5 Video Loops限制 HTML5 视频循环的数量
【发布时间】:2017-08-16 00:24:39
【问题描述】:

:) 我正在尝试仅将 HTML5 视频循环 3 次。我发现this codesn-p 基本上可以满足我的要求。奇怪的是,我无法让它工作。如果我在 stackoverflow 上运行演示,它就可以工作。如果我将其复制并粘贴到空白的 html 文档中,则不会。有什么建议吗?

谢谢!

【问题讨论】:

  • 我认为 loop="3" 应该可以工作

标签: javascript html loops video limit


【解决方案1】:

尝试复制+粘贴。这应该可以。

<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>

【讨论】:

    【解决方案2】:

    你是否在正文部分的末尾添加 JS 脚本? 脚本应添加在正文部分的末尾(加载文档时)。

    【讨论】:

    • 所以将整个 &lt;script&gt;...&lt;/script&gt; 放在正文部分的末尾,它应该可以工作:pastebin snippet
    • 当然你需要在if语句中更改iterations &lt; 3:)
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2014-01-12
    • 2015-05-03
    • 2014-04-24
    • 1970-01-01
    • 2012-05-09
    • 2015-07-19
    • 1970-01-01
    相关资源
    最近更新 更多