Bobscript

iOS下click事件不冒泡的解决

iOS下click事件不冒泡的解决

前几天遇到了,使用zepto的.on进行click事件委托的时候,当委托到document,发现只有目标元素为a才行,现象就是click事件不会冒泡到document。

当时由于没有设备,没有过多的测试,最近部门新添好多iOS设备啦~~~btw ,今天发现jQuery的文档里面居然提到了这一点。

On mobile iOS (iPhone, iPad and iPod Touch) the click event does not bubble to the document body for most elements and cannot be used with .live() without applying one of the following workarounds:

  1. Use natively clickable elements such as a or button, as both of these do bubble to document.
  2. Use .on() or .delegate() attached to an element below the level of document.body, since mobile iOS does bubble within the body.
  3. Apply the CSS style cursor:pointer to the element that needs to bubble clicks (or a parent including document.documentElement). Note however, this will disable copy\paste on the element and cause it to be highlighted when touched.

简单翻译一下,就是

  1. 使用原生的支持click冒泡到document的元素,例如abutton
  2. 委托事件的时候,委托到body以下的元素上面
  3. 对目标元素使用CSS cursor:pointer, 或者应用于其父元素——包括html都行,不过会导致复制粘贴失效,而且点击时候高亮

工作上:最近再次多个任务交叉的感觉 上个月买的几盆蝴蝶兰长叶子了 最近买了两个手柄,通关了米老鼠幻影城堡、爱丽丝疯狂回归,现在开始玩以前没有机会玩的生化危机5