播放暂停html5视频javascript
我有一个功能，当我点击播放器中显示的海报图像时，它可以播放视频，它似乎起作用了：
var video = document.getElementById('player');
video.addEventListener('click',function(){
video().play();
},false);在html5视频标签中，我有类似于: id="player“onclick="this.play();”
问题是，如果我在视频控件上按下pause，它实际上会暂停，这是很好的，但如果我按下视频控件上现在的播放按钮，我可以看到按钮再次更改为暂停一小段时间，然后它又恢复为播放按钮。所以我按了播放，它只播放了几帧，然后又回到了暂停。让它再次播放的唯一方法是单击视频查看区域。
如何在使用控制栏播放/暂停按钮时停止返回暂停，如何在单击视频查看区域时使其暂停？
我尝试了以下方法，但不起作用：
var video = document.getElementById('player');
video.addEventListener('click',function(){
if(video.paused){
video().play();
}else{
video.pause();
}
},false);我想在按下实际的观看区域时播放视频的原因是，在Android上很难找到小的控制栏播放按钮，因为它太小了，人们只需按下观看区域就可以更容易地让它继续播放。在火狐中，当我点击查看区域时，视频播放器就会播放，也会暂停，这正是我想要的，而且它也不需要任何javascript就能做到这一点。在安卓系统中，当我按下查看区域时，视频根本无法播放。因此，我基本上是想迫使Android浏览器像Firefox那样运行。
回答 7
Stack Overflow用户
发布于 2012-06-05 00:34:08
在我看来，视频不是一个函数，你为什么要用括号呢？这就是你的错误。
所以只需使用video而不是video()
Stack Overflow用户
发布于 2012-09-27 21:27:20
这种方式(使用jquery)适用于Chrome v22、火狐v15和IE10：
$('video').on('click', function (e) {
if (this.get(0).paused) {
this.get(0).play();
}
else {
this.get(0).pause();
}
e.preventDefault();
});这里的preventDefault阻止了你看到的跳帧问题，但随后它破坏了控制部分的其他按钮，如全屏等。
看起来并不容易，为什么要这样做呢？我本以为供应商会默认点击播放，这似乎是合乎逻辑的事情。：
Stack Overflow用户
发布于 2015-10-21 16:30:23
这是最简单的解决方案
this.on("pause", function () {
$('.vjs-big-play-button').removeClass(
'vjs-hidden'
).css('display', 'block');
this.one("play", function () {
$('.vjs-big-play-button').addClass(
'vjs-hidden'
).css('display', '');
});
});https://stackoverflow.com/questions/10327907
复制相似问题
腾讯云开发者
