苹果手机浏览器$(document).on(“click”,function(){})点击无效的问题
今天在测试的时候发现,动态生成元素的点击事件$(document).on(“click”,function(){})在andriod设备和电脑浏览器模拟上可以触发,而在apple移动设备上却无法触发。
试过很多办法,在元素生成后 再绑定事件,把click改成touch事件,都没有用,最后好不容易百度到了解决办法
解决的方法很巧妙,就是给需要绑定事件的元素添加一个css cursor: pointer 。
selector { cursor:pointer}
一试,竟然真的有用,苹果的坑真是凡人无法理解。但加上这个以后呢,点击的时候会有闪烁得效果,查资料以后,在css中给被点击元素加上
-webkit-tap-highlight-color: rgba(0,0,0,0);的样式,闪烁效果就不存在了。
个人理解,document的元素太大,点击事件$(document).on(“click”,function(){})获取不到焦点,故没有起作用。另一种方法是将document换为父级元素。即$(“#parentBox”).on(“click”,function(){})来解决;大家都可以去尝试一下。