有没有一种简单的方法使用JavaScript/jQuery将HTML视频元素倒回去？

Question

有没有一种简单的方法使用JavaScript/jQuery将HTML视频元素倒回去？

3

我有一个需要在网站上展示的视频。我不能让用户快进它，但他们需要能够倒回去。我已经修改了这个例子：https://www.w3schools.com/tags/tryit.asp?filename=tryhtml5_av_prop_controller。

<!DOCTYPE html> 
<html> 
<body> 

<video id="myVideo" width="320" height="176" onclick="playOrPause();" oncontextmenu="return false;" controls >
  <source src="https://www.w3schools.com/tags/mov_bbb.mp4" type="video/mp4">
  <source src="https://www.w3schools.com/tags/mov_bbb.ogg" type="video/ogg">
  Your browser does not support HTML5 video.
</video>
<div>
    
<input type="button" id="btnRewind" name="btnRewind" value="Rewind" onclick="rewindVideo();" />
<input type="button" id="btnPlay" name="btnPlay" value="Play" onclick="playVideo();" />
<input type="button" id="btnPause" name="btnPause" value="Pause" onclick="pauseVideo();" />
</div>

<script>
    var video = document.getElementById("myVideo");
    
    function playOrPause() {
        if (video.paused) {
            playVideo();
        } else {
            pauseVideo();
        }
    }
    
    function playVideo() {
        video.play();        
    }
    
    function pauseVideo() {
        video.pause();
    }
    
    function rewindVideo() {
        //video.currentTime -= 0.5;
        video.playBackRate = -2;
        video.play();
    }    

</script> 

<p>Video courtesy of <a href="https://www.bigbuckbunny.org/" target="_blank">Big Buck Bunny</a>.</p>

</body> 
</html>

有没有一种简单的方法可以从当前位置倒回视频？我想避免使用整个库来实现倒回功能。但可以使用 jQuery。

- CaptonMike

如果你所说的“倒带”是指“后退几秒钟”，那么你的代码就可以正常工作（如果你取消注释video.currentTime -= 0.5;（我将其更改为1/2秒，只是为了在添加视频URL时进行测试））。 - freedomn-m

如果你所说的“倒带”是指“倒放播放”，那么极不可能。 - freedomn-m

是的，我确实是指倒放播放。我相信你是正确的。 - CaptonMike

这是可能的，但并不容易。我在这里找到了一个可行的例子：https://www.elstel.org/html5video/Html5VideoScripting.html.en - CaptonMike

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- חִידָה · Accepted Answer

如何使用JS将“video”元素倒回2秒钟：

function Rewind() { 
var myVideo = document.getElementById("myVideo");
myVideo.currentTime = myVideo.currentTime -2; }

如何使用JS快进“video”元素2秒钟：

function FastForward() { 
var myVideo = document.getElementById("myVideo");
myVideo.currentTime = myVideo.currentTime +2; }