項目在祖先元素上綁定了 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,如需轉載請自行聯系原作者