wat*_*att 13 javascript css jquery mobile-safari dom-events
这是我正在处理的动态JavaScript应用程序.我有很多<a>有一个类的锚元素.单击该类时,应该发生一些事情.这在Firefox,Chrome,IE中运行良好,但在某些情况下,点击事件不会在移动Safari(iPad和iPhone)上触发.
这些元素都具有完全相同的CSS,只是它们的位置不同(它们位于不同的容器中).
我尝试了各种解决方案,但我没有运气.例如:
你还有其他想法可以帮助我找到解决方案吗?为什么click事件仅在某些情况下触发?
谢谢!
Lin*_*usR 23
点击iOS上的点击事件将在某些条件下按预期冒泡 - 您提到的其中一个是光标样式.这是另一个:
目标元素或其任何祖先(包括但不包括
<body>)具有为任何鼠标事件设置的显式事件处理程序.此事件处理程序可能是一个空函数.
http://www.quirksmode.org/blog/archives/2014/02/mouse_event_bub.html
这是更好的修复向量,可以在没有浏览器检查的情况下完成.由于"不包括<body>"部分,您必须添加额外的div :
<body>
<div onclick="void(0);">
<!-- ... all your normal body content ... -->
</div>
</body>
Run Code Online (Sandbox Code Playgroud)
现在,来自该div内部的每个点击事件都会按预期在iOS中冒泡(意味着您可以抓住它们$(document).on('click', '.class', etc...)).
小智 7
你试过这个吗?这是因为ios有时不触发点击事件,只识别触摸事件
$(document).on('touchstart click', [Selector], [ Event ]
Run Code Online (Sandbox Code Playgroud)
只需声明这些空事件侦听器即可。就试一试吧 :)
这将使其适用于所有浏览器:
container.addEventListener('touchstart', () => {});
container.addEventListener('touchend', () => {});
container.addEventListener('touchcancel', () => {});
container.addEventListener('touchmove', () => {});
Run Code Online (Sandbox Code Playgroud)