iPad 上的 HTML5 视频元素无法触发 onclick?
我在 HTML 中使用视频元素,如下所示:
<div id="container" style="background:black; overflow:hidden;width:320px;height:240px">
<video style="background:black;display:block" id="vdo" height="240px" width="320px" src="http://mydomain/vid.mp4"></video></div>
And in javascript I am doing this:var video=document.getElementById('vdo');
var container=document.getElementById('container');
video.addEventListener('click', function(e) {
e.preventDefault();
console.log("clicked");
}, false);
container.addEventListener('click', function(e) {
e.preventDefault();
console.log("clicked");
}, false);
On desktop safari/chrome everything is working fine. I can see two "clicked" in the console. But on ipad there is nothing. First I tried with iOS versin 3.2, then I updated it to the latest one 4.2.1 without any success.I found a similar question HTML5 Video Element on iPad doesn't fire onclick or touchstart events? where it suggests not to use controls in video tag and I am not using it.
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(3)
这是一个很晚的答案,但以防万一有人想知道。如果您将事件更改为“touchstart”,它将起作用。
这种行为对我来说似乎有点随机,因为点击在大多数情况下都有效。我还没有研究确切的原因和时间
This is a very late answer, but in case anyone wonders. If you change your event to "touchstart" it will work.
This behavior seems sort of random to me, because click works most of the time. I have not looked into exactly why and when
您是否确认当前没有其他点击会干扰该事件?我所做的是在添加新侦听器之前首先取消特定事件的绑定。
即:
我发现这可以解决我遇到的问题。
Have you confirmed there are currently no other clicks that are interfearing with that event? What I've done is first unbind on the particular event before adding the new listener.
ie:
I found this to fix the issue I was having.
我尝试按照 Frederico 的建议取消绑定/单击,但仍然没有收到任何单击事件。不过,我确实让 touchstart 和 touchend 事件正常。 (我实际上是从 DOM 中上一级的 div 获取它们,但我希望您也可以从 video 元素中获取它们。)
I tried unbind/click as suggested by Frederico, but I still didn't receive any click events. I do, however, get touchstart and touchend events OK. (I'm actually getting them from a div one level up in the DOM, but I expect you could also get them from the video element just the same.)