jquery取消事件冒泡的三種方法(推薦)
1、通過返回false來取消默認(rèn)的行為并阻止事件起泡。
jQuery 代碼:
$("form").bind( "submit", function() { return false; } );
2、通過使用 preventDefault() 方法只取消默認(rèn)的行為。
jQuery 代碼:
$("form").bind( "submit", function(event){ event.preventDefault(); } );
3、通過使用 stopPropagation() 方法只阻止一個(gè)事件起泡。
jQuery 代碼:
$("form").bind( "submit", function(event){ event.stopPropagation(); } );
(4)總結(jié)
1. 一個(gè)事件起泡對(duì)應(yīng)觸發(fā)的是上層的同一事件
特殊:如果two設(shè)置成雙擊事件,那么在你單擊two的時(shí)候就會(huì)起泡觸發(fā)one單擊的事件
(雙擊包含單擊)。
2. 如果在click事件中,在你要處理的事件之前加上e.preventDefault();
那么就取消了行為(通俗理解:相當(dāng)于做了個(gè)return操作),不執(zhí)行之后的語句了。
3. e.stopPropagation()只要在click事件中,就不會(huì)觸發(fā)上層click事件。
//如果提供了事件對(duì)象,則這是一個(gè)非IE瀏覽器 if ( e && e.stopPropagation ) // 因此它支持W3C的stopPropagation()方法 e.stopPropagation(); else //否則,我們需要使用IE的方式來取消事件冒泡 window.event.cancelBubble = true; return false;
以上這篇jquery取消事件冒泡的三種方法(推薦)就是小編分享給大家的全部?jī)?nèi)容了,希望能給大家一個(gè)參考,也希望大家多多支持腳本之家。
相關(guān)文章
jquery實(shí)現(xiàn)橫向圖片輪播特效代碼分享
這篇文章主要介紹了jquery實(shí)現(xiàn)橫向圖片輪播特效代碼,效果很精致,實(shí)現(xiàn)方法很簡(jiǎn)單,特推薦給大家,希望大家可以喜歡。2015-11-11jquery表單對(duì)象屬性過濾選擇器實(shí)例分析
這篇文章主要介紹了jquery表單對(duì)象屬性過濾選擇器,實(shí)例分析了jQuery選擇器的相關(guān)使用技巧,需要的朋友可以參考下2015-05-05jQuery+datatables插件實(shí)現(xiàn)ajax加載數(shù)據(jù)與增刪改查功能示例
這篇文章主要介紹了jQuery+datatables插件實(shí)現(xiàn)ajax加載數(shù)據(jù)與增刪改查功能,涉及jQuery結(jié)合datatables插件針對(duì)頁面表格實(shí)現(xiàn)數(shù)據(jù)加載及增刪改查等相關(guān)操作技巧,需要的朋友可以參考下2018-04-04jQuery實(shí)現(xiàn)手勢(shì)解鎖密碼特效
這篇文章主要為大家詳細(xì)介紹了jQuery實(shí)現(xiàn)手勢(shì)解鎖密碼特效,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2017-08-08jQuery插件zTree實(shí)現(xiàn)刪除樹節(jié)點(diǎn)的方法示例
這篇文章主要介紹了jQuery插件zTree實(shí)現(xiàn)刪除樹節(jié)點(diǎn)的方法,結(jié)合實(shí)例形式分析了jQuery樹插件zTree針對(duì)節(jié)點(diǎn)的遍歷與刪除操作相關(guān)技巧,需要的朋友可以參考下2017-03-03jQuery實(shí)現(xiàn)監(jiān)聽下拉框選中內(nèi)容發(fā)生改變操作示例
這篇文章主要介紹了jQuery實(shí)現(xiàn)監(jiān)聽下拉框選中內(nèi)容發(fā)生改變操作,結(jié)合實(shí)例形式分析了jQuery針對(duì)select選中觸發(fā)change事件相關(guān)操作技巧,需要的朋友可以參考下2018-07-07idTabs基于JQuery的根據(jù)URL參數(shù)選擇Tab插件
我們的項(xiàng)目用了SunSean的idTabs,但每個(gè)tab里的控件會(huì)觸發(fā)postback,或者轉(zhuǎn)到其他頁面再轉(zhuǎn)回來,這樣當(dāng)前選中的tab必丟。印度同事不肯用AJAX,無奈今天加班給印度人寫個(gè)demo,通過回傳URL參數(shù)來選擇tab2012-04-04