Question

我正在尝试编写一些JavaScript来执行此操作，但我无法弄清楚为什么我的方法无效。

pandoc

小提琴：https://jsfiddle.net/f90yu2t4/1/

HTML视频是否不够先进，无法在视频中支持这种快速移动？

Answer 1

两件事：

对于JSFiddle，代码已经包装在window.onload中，另一个window.onload中的代码实际上没有被执行。你应该删除包装器（至少在使用JSFiddle时）。

其次，在setTimeout函数中，vid.currentTime = vid.currentTime + tdelta * j;不能按预期工作，因为vid.currentTime的第二个实例不是一个恒定的开始时间。您应该在setTimeout函数之前分配startTime，并且vid.currentTime = startTime + tdelta * j;

有了这些更改，请在此处查看：更新小提琴：https://jsfiddle.net/f90yu2t4/8/

Answer 2

<script type="text/javascript">

    function vidplay() {
       var video = document.getElementById("Video1");
       var button = document.getElementById("play");
       if (video.paused) {
          video.play();
          button.textContent = "||";
       } else {
          video.pause();
          button.textContent = ">";
       }
    }

    function restart() {
        var video = document.getElementById("Video1");
        video.currentTime = 0;
    }

    function skip(value) {
        var video = document.getElementById("Video1");
        video.currentTime += value;
    }      
</script>


<body>        

<video id="Video1" >
//  Replace these with your own video files. 
     <source src="demo.mp4" type="video/mp4" />
     <source src="demo.ogv" type="video/ogg" />
     HTML5 Video is required for this example. 
     <a href="demo.mp4">Download the video</a> file. 
</video>

<div id="buttonbar">
    <button id="restart" onclick="restart();">[]</button> 
    <button id="rew" onclick="skip(-10)">&lt;&lt;</button>
    <button id="play" onclick="vidplay()">&gt;</button>
    <button id="fastFwd" onclick="skip(10)">&gt;&gt;</button>
</div>         
</body>

如何将HTML5视频快进或快退到特定时间点

2 个答案: