JavaScript中怎么捕捉事件和阻止冒泡事件
JavaScript中怎么捕捉事件和阻止冒泡事件，很多新手對此不是很清楚，為了幫助大家解決這個難題，下面小編將為大家詳細講解，有這方面需求的人可以來學(xué)習(xí)下，希望你能有所收獲。
創(chuàng)新互聯(lián)建站主要從事網(wǎng)站建設(shè)、成都網(wǎng)站制作、網(wǎng)頁設(shè)計、企業(yè)做網(wǎng)站、公司建網(wǎng)站等業(yè)務(wù)。立足成都服務(wù)九原,十余年網(wǎng)站建設(shè)經(jīng)驗,價格優(yōu)惠、服務(wù)專業(yè),歡迎來電咨詢建站服務(wù):028-86922220
一、要探究捕獲和冒泡事件，首先要知道什么是事件的捕獲和冒泡，所以呢，先從概念入手；
事件的冒泡：在一個對象上觸發(fā)某類事件（比如單擊onclick事件），如果此對象定義了此事件的處理程序，那么此事件就會調(diào)用這個處理程序，如果沒有定義此事件處理程序或者事件返回true，那么這個事件會向這個對象的父級對象傳播，從里到外，直至它被處理（父級對象所有同類事件都將被激活），或者它到達了對象層次的最頂層，即document對象（有些瀏覽器是window）。
其實事件冒泡是一個從后代節(jié)點向祖先節(jié)點冒泡的過程，而捕獲是從祖先節(jié)點到后節(jié)點的過程。
我為了方便理解，則用先捕獲，后冒泡，捕獲從上到下，冒泡從下到上來記憶。我記得從哪兒看到的，有人把捕獲比喻為石頭沉入海底，而把冒泡比喻為氣泡冒出水面。當然了，捕獲的深度取決于你的DOM布局，海底就有點深了哈，^_^
注意：IE6、IE7、IE8只支持冒泡流，不支持捕獲流。
二、為什么要阻止冒泡事件
也許會有人問：為什么要阻止冒泡事件呢？阻止冒泡事件有什么用處呢？
下面我們就來說下為什么要阻止冒泡事件：
先舉個例子吧，如下代碼：
Click Here
從上面的代碼可以看出，div_1是div_2的容器，而div_2是a的容器，總共三層。
我們運行這個實例，點擊Click Here會發(fā)現(xiàn)，分別彈出了三個alert提示框，而且順序為I'm Third! 、I'm Second!、I'm First!，這就符合我們上面提到的冒泡的概念了。
而我這次碰到的問題就是這樣，我稱之為“事件重疊”。
出現(xiàn)這種情況，肯定不行，所以我們要阻止該事件冒泡的發(fā)生，那如何來阻止呢？下面將。
三、阻止事件冒泡的方法
首先我先給出一個純JavaScript版的寫法：
function aOnClick(e){
window.event? window.event.cancelBubble = true : e.stopPropagation();
}解釋：因為IE里的阻止冒泡的寫法為window.event.cancelBubble = true，其他瀏覽器為e.stopPropagation();所以這里做了兼容。
再給出一個jQuery版本的寫法：
$(function() {
$("#alink").click(function(event) {
event.stopPropagation();
});
});四、阻止冒泡的其他方法及不同
我就是用上面的函數(shù)阻止了冒泡，但是還有其他的方法可以達到類似的效果，但還是有所不同；
$("#alink").click(function(event) {
return false;
});解釋：上面方法使用jQuery對alink進行了操作，經(jīng)過測試，得出結(jié)論，該函數(shù)阻止了冒泡，但是它將a的默認行為也屏蔽掉了(此處為href屬性)。這就是不同之處。
順便說下，javasccript的阻止默認行為的方法
event.preventDefault();
看完上述內(nèi)容是否對您有幫助呢？如果還想對相關(guān)知識有進一步的了解或閱讀更多相關(guān)文章，請關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道，感謝您對創(chuàng)新互聯(lián)的支持。
當前題目：JavaScript中怎么捕捉事件和阻止冒泡事件
文章分享：
http://weahome.cn/article/gejcos.html
重慶分公司
重慶分公司
