zepto.js中tap事件阻止冒泡的實(shí)現(xiàn)方法
更新時(shí)間：2015年02月12日 11:36:38 作者：小蝦虎魚
這篇文章主要介紹了zepto.js中tap事件阻止冒泡的實(shí)現(xiàn)方法,實(shí)例分析了由冒泡產(chǎn)生的click延遲解決方法,需要的朋友可以參考下
本文實(shí)例講述了zepto.js中tap事件阻止冒泡的實(shí)現(xiàn)方法。分享給大家供大家參考。具體如下：
最近在弄一個(gè)手機(jī)版的網(wǎng)站，本來想用jQuery Mobile，但文件太大了，所以用了zepto.js
由于移動網(wǎng)頁中使用click事件會有延遲，所以就用上了zepto.js中的tap事件。
使用click事件可以使用stopPropagation來阻止冒泡，但tap使用該方法無效
現(xiàn)在我需要實(shí)現(xiàn)這樣一個(gè)效果：點(diǎn)擊a.btn這個(gè)按鈕，然后顯示div.panel，當(dāng)我點(diǎn)擊非div.panel時(shí)隱藏div.panel
$("a.btn").on("tap",function(e){
e.stopPropagation();//該方法不起作用
$("div.panel").show();
});
$(document).on("tap",function(e){
$("div.panel").hide();
});
通過調(diào)試工具，得到e這個(gè)對象中有一個(gè)target屬性，于是可以通過該屬性來實(shí)現(xiàn)所需要的效果：
$("a.btn").on("tap",function(){
$("div.panel").show();
});
$(document).on("tap",function(e){
if(!$(e.target).hasClass("btn")){
$("div.panel").hide();
}
});
這樣算是解決了
希望本文所述對大家的javascript程序設(shè)計(jì)有所幫助。
相關(guān)文章
Layui表格行內(nèi)動態(tài)編輯數(shù)據(jù)
本文主要介紹經(jīng)典前端框架 layui 中的動態(tài)表格數(shù)據(jù)操作，結(jié)合 JQuery 動態(tài)編輯單元格中的數(shù)據(jù)，具有一定的參考價(jià)值，感興趣的可以了解一下2021-08-08
本篇文章主要給大家講述了JavaScript體驗(yàn)異步更好的解決辦法，有這方面需要的朋友跟著學(xué)習(xí)參考下吧。2018-01-01
下面小編就為大家?guī)硪黄趓em的移動端響應(yīng)式適配方案(詳解)。小編覺得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2017-07-07
鼠標(biāo)移到div,浮層顯示明細(xì),彈出層與div的上邊距左邊距重合(示例代碼)
這篇文章主要介紹了鼠標(biāo)移到div,浮層顯示明細(xì),彈出層與div的上邊距左邊距重合的實(shí)例代碼。需要的朋友可以過來參考下，希望對大家有所幫助2013-12-12
這篇文章主要介紹了JavaScript中消除閉包的一般方法介紹,本文直接給出了操作示例,需要的朋友可以參考下2015-03-03
javascript檢測瀏覽器精簡版，需要的朋友可以參考下。2010-03-03
詳解ES6 Fetch API HTTP請求實(shí)用指南
本次將介紹如何使用Fetch API（ES6 +）對REST API的 HTTP請求，還有一些示例提供給大家便于大家理解。具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2018-11-11
JS獲取鼠標(biāo)坐標(biāo)位置實(shí)例分析
這篇文章主要介紹了JS獲取鼠標(biāo)坐標(biāo)位置的方法,結(jié)合實(shí)例形式分析了JavaScript常見的獲取鼠標(biāo)頁面、屏幕等坐標(biāo)位置的技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2016-01-01
前端防止用戶重復(fù)提交js實(shí)現(xiàn)代碼示例
這篇文章主要給大家介紹了關(guān)于前端防止用戶重復(fù)提交js實(shí)現(xiàn)的相關(guān)資料，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起看看吧2018-09-09
在Js中有一些比較冷門但是非常好用的方法，我在這里稱之為高級方法，這些方法沒有被廣泛使用或多或少是因?yàn)榇嬖谝恍┘嫒菪缘膯栴}，不是所有的瀏覽器都讀得懂的，這篇文章主要就是對這些方法做一個(gè)總結(jié)，讓我們一起來看一下吧2023-06-06