zepto.js中tap事件阻止冒泡的實現(xiàn)方法
更新時間：2015年02月12日 11:36:38 作者：小蝦虎魚
這篇文章主要介紹了zepto.js中tap事件阻止冒泡的實現(xiàn)方法,實例分析了由冒泡產(chǎn)生的click延遲解決方法,需要的朋友可以參考下
本文實例講述了zepto.js中tap事件阻止冒泡的實現(xiàn)方法。分享給大家供大家參考。具體如下：
最近在弄一個手機版的網(wǎng)站，本來想用jQuery Mobile，但文件太大了，所以用了zepto.js
由于移動網(wǎng)頁中使用click事件會有延遲，所以就用上了zepto.js中的tap事件。
使用click事件可以使用stopPropagation來阻止冒泡，但tap使用該方法無效
現(xiàn)在我需要實現(xiàn)這樣一個效果：點擊a.btn這個按鈕，然后顯示div.panel，當我點擊非div.panel時隱藏div.panel
$("a.btn").on("tap",function(e){
e.stopPropagation();//該方法不起作用
$("div.panel").show();
});
$(document).on("tap",function(e){
$("div.panel").hide();
});
通過調試工具，得到e這個對象中有一個target屬性，于是可以通過該屬性來實現(xiàn)所需要的效果：
$("a.btn").on("tap",function(){
$("div.panel").show();
});
$(document).on("tap",function(e){
if(!$(e.target).hasClass("btn")){
$("div.panel").hide();
}
});
這樣算是解決了
希望本文所述對大家的javascript程序設計有所幫助。
相關文章
JavaScript之Canvas_動力節(jié)點Java學院整理
這篇文章主要介紹了JavaScript之Canvas，Canvas是HTML5新增的組件，它就像一塊幕布，可以用JavaScript在上面繪制各種圖表、動畫等2017-07-07
uni-app??? 是一個使用 ???Vue.js?? 開發(fā)所有前端應用的框架，開發(fā)者編寫一套代碼，可發(fā)布到iOS、Android、H5、以及各種小程序（微信/支付寶/百度/頭條/QQ/釘釘）等多個平臺，這篇文章主要介紹了uni-app的基本使用,需要的朋友可以參考下2022-11-11
隨機顏色如何獲取，在本文將為大家介紹下如何使用js來獲取，感興趣的朋友可以參考下2013-09-09
JS事件Event元素(兼容IE,Firefox,Chorme)
今天，想聊聊JS事件對象。相信大家對于獲得激發(fā)JS事件的原對象的理解，有的人可能簡單停留在IE上。也就是window.event這個對象2012-11-11
本文主要介紹了SyntaxHighlighter的配置及代碼的使用，并附上在博客園中使用SyntaxHighlighter 3.0.83的案例，非常實用，這里推薦給大家。2015-01-01
這篇文章主要給大家介紹了如何通過一篇文章讓你輕松記住js的隱式轉化的相關資料,通過在各種情況下發(fā)生的隱式類型的例子,來詳細的了解隱式類型轉換的過程,需要的朋友可以參考下2022-01-01
這篇文章主要介紹了JS控制輸入框內字符串長度,需要的朋友可以參考下2014-05-05
這篇文章主要為大家介紹了正則test匹配的踩坑示例講解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進步，早日升職加薪2022-07-07
今天小編就為大家分享一篇使用layui的layer組件做彈出層的例子，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2019-09-09
一鍵回頂功能想必大家在瀏覽網(wǎng)頁時會經(jīng)常遇到吧，實現(xiàn)的方法也有很多，在本文為大家介紹下js是如何實現(xiàn)的，感興趣的朋友可以參考下2013-10-10