我具有以下点击功能,以便在单击视频时播放视频。它在桌面浏览器上可以完美运行,但在平板电脑上则不能。您按它,视频立即暂停。我相信这与单击功能有关,它可以查找单击,而平板电脑上没有单击,但是我不确定如何解决。
HTML
<div class="section">
<div class="video">
<video poster="img/my-poster.jpg"><source src="mp4/low-res/my-video.mp4" type="video/mp4"></video>
</div>
</div>
jQuery
$(document).ready(function () {
$('.section video').on("click touchstart", function() {
this.paused ? this.play() : this.pause();
});
});
答案 0 :(得分:3)
那是因为您的touchstart
和click
处于冲突。
有一个黑客可以防止这种冲突:
var flag = false;
$('.section video').on("click touchstart", function(){
if (!flag) {
flag = true;
setTimeout(function(){ flag = false; }, 100);
this.paused ? this.play() : this.pause();
}
return false;
});
积分和更多信息:How to bind 'touchstart' and 'click' events but not respond to both?
编辑:感谢@RoryMcCrossan提供有关bind()的精度