移动web app开发必备 - zepto事件问题问题描述:发一段项目图：Zepto事件绑定子元素上增加一个hack标记, 控制器冒泡过滤排除

项目在祖先元素上绑定了 touchstart,touchmove,touchend事件,用来处理全局性的事件,比如滑动翻页

正常状态下：

用户在子元素上有交互动作时,默认状态下都是会冒泡到祖先元素响应

特定情况下：

子元素单独绑定了事件

特性情况下需要阻止全局事件

常规的做法就是stopPropagation阻止即可

但如果子元素绑定的是 click,touchmove,touchend这类事件的话,问题就来了

全局的touchstart事件也会被冒泡触发

<a></a>

2

<code>on绑定的事件替换成硬编码容易理解</code>

<code>bind:</code><code>function</code><code>(element, evtName, fn) {</code>

<code>     </code><code>element.on(</code><code>'mousedown'</code><code>,</code><code>function</code><code>(e) {</code><code>//阻止 mousedown事件冒泡</code>

<code>         </code><code>e.stopPropagation();</code>

<code>     </code><code>});</code>

<code>     </code><code>element.on(</code><code>'swipeLeft'</code><code>, fn);</code><code>//绑定真正事件</code>

<code> </code><code>},</code>

给元素绑定'swipeLeft'滑动事件,同时阻止'mousedown'冒泡到祖先元素,此时理论上就可行了

这样处理之后zepto移动事件确失效了

zepto移动事件失效的根源找到了,不能阻止事件冒泡了,不能拦截了

偏偏Zepto不让你这么安逸,学jquery的live()方法一样，把事件给绑到body元素上了, jquery1.7后就去掉了,zepto你也要跟上呀

处理的办法：

 本文转自艾伦 Aaron博客园博客，原文链接：http://www.cnblogs.com/aaronjs/p/3169480.html，如需转载请自行联系原作者