Question

我有一个页面，该页面使用html5视频标签播放视频的短片（此页面上不应显示完整视频）。如果用户访问该页面并向后导航，则当他们第二次访问（几分钟之内）时，该视频将无法播放。我相信这是因为我使用jQuery在7秒后暂停了视频：

$('#playButton').click(function(event){
$('#theVideo').get(0).play()    
setTimeout(function(){$('#theVideo').get(0).pause() }, 7000);
});

我尝试使用.stop()，如对此问题的不可接受的答案所建议： Make HTML5 video stop at indicated time

此代码不起作用：

// doesn't work
setTimeout(function(){$('#theVideo').get(0).stop()  }, 7000);
// also doesn't work
setTimeout(function(){$('#theVideo').stop() }, 7000);

我已经参考了Mozilla的文档。我发现有关jQuery和HTML5视频的唯一准官方文档来自w3schools： https://www.w3schools.com/tags/ref_av_dom.asp

它没有引用“停止”方法。我应该期望.stop（）起作用，还是需要找到其他解决方案？

我的视频代码：

<video playsinline id='theVideo' poster=''>
<source src='http://somedomain/subfolder/playlist.m3u8'>
</video>
<div id="playButton">PLAY</div>

感谢您的帮助。

Answer 1

没有var media = $("#video-id").get(0); media.pause(); media.currentTime = 0;。您可以暂停一下...

但是您也可以将.stop()设置为零（文件开始）...
希望它可以在随后的currentTime单击中再次播放。

那将是：

#playButton

}）;

现在，«如果用户访问页面并向后导航» ...使用浏览器的后退按钮？在这里您无能为力。不运行的JavaScript类似于此处的正常页面加载。一切都不会发生。

Answer 2

您可以通过暂停和currentTime停止它。

this.form.get('checkboxGroup')

查看以下内容：https://developer.mozilla.org/en-US/docs/Learn/JavaScript/Client-side_web_APIs/Video_and_audio_APIs

Answer 3

将 srcObject 设置为 null。

var video = document.getElementById('video');

if(navigator.mediaDevices && navigator.mediaDevices.getUserMedia) {
    
    navigator.mediaDevices.getUserMedia({ video: true }).then(function(stream) {
        video.srcObject = null;
    });
}

如何使用jQuery停止（不暂停）html5视频

3 个答案: