为什么Html5视频播放器区域只对鼠标点击做出反应，而对手指触摸没有反应？
提问于 2022-02-08 17:21:02
我试图使它，以便我可以使用我的手指(触摸)在任何地方的视频播放器开始和停止它。
但是，只有当我用手指按下音频控件时，我才能启动和停止视频：
或者，我可以用鼠标点击视频播放器上的任何位置。鼠标单击将启动或停止视频。
我不知道问题是手指触摸(不像鼠标点击)不会引发特定事件，或者触摸视频通常不会启动/停止，为此我需要一个函数。
这是我找到的一个例子。但是，它不起作用:当我用鼠标点击视频时，它很快就停止了，然后又开始了。
谢谢您对这里可能发生的事情和如何解决它的任何提示。
<html>
<head><meta name="viewport" content="width=device-width">
</head>
<body>
<video onclick="playPause()" id="video_player" controls="controls" poster="">
<source id="video_mp4" src="file:///C:/Users/Kommunikation/Desktop/affen.mp4" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"' />
</video>
<script>
var myVideo = document.getElementById("video_player");
function playPause() {
if (myVideo.paused)
myVideo.play();
else
myVideo.pause();
}
</script>
</body>
</html>
回答 1
Stack Overflow用户
发布于 2022-02-08 18:01:01
我拿到了：
我需要对触控启动(或触控端)做出反应：
<html>
<head><meta name="viewport" content="width=device-width">
</head>
<body>
<video ontouchstart="playPause()" id="video1" controls="controls" poster="">
<source id="somevideoID" src="file:///C:/Users/Kommunikation/Desktop/affen.mp4" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"' />
</video>
<script>
function playPause(e) {
var myVideo = document.getElementById("video1");
if (myVideo.paused) myVideo.play();
else myVideo.pause();
}
</script>
</body>
</html>页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/71042910
复制相关文章
![[译] React Native vs. Cordova、PhoneGap、Ionic，等等](https://ask.qcloudimg.com/http-save/yehe-1687375/9uyutqftrr.jpeg)
![几款移动跨平台App开发框架比较[通俗易懂]](https://ask.qcloudimg.com/http-save/yehe-8223537/d71683e7b4a579c121724297d1efea0c.png)
点击加载更多
腾讯云开发者
