php、java、android、ios通用的3des方法(推薦)
636
2024-01-27
首先，大家都知道，jQuery事件觸發時有2種機制，一種是事件委托，另一種是事件冒泡（IE情況暫時不考慮）。拿click事件做例子，先附上一段代碼：
html：
<body>
<div id="box">
<p id="btn">我是按鈕</p>
</div>
</body>
style:
.hid{
display:none;
}
script：
$('#box').click(function(){
$(‘#btn').toggleClass(‘hid');
})
$('#btn').click(function(){
alert('btn');
})
這段代碼的本意是，當我點擊#btn的時候，我要alert出來“btn”字符串，而當我點擊#box的時候，我要把#btn隱藏，但是，在實際執行的時候，當我點擊btn的時候，他是會先執行btn的事件，繼而執行box的事件，也就是先alert，再隱藏。與我們所想有所出入，那到底要怎么解決這個問題呢，這里就要想到事件冒泡這個機制，因為當我點擊btn的時候，事件會向上冒泡到父元素，直至document對象。
1.7（沒記錯的話）之后的jQuery版本，提供了.on()事件，用來處理綁定元素的事件，這里我們可以用.on()事件，以及stopPropagation()方法來阻止事件冒泡：
$('#box').on('click','#btn',function(e){
e.stopPropagation()；
alert(‘btn');
})
$('#box').click(function(){
$(‘#btn').toggleClass(‘hid');
})
這里我先用on綁定了#btn的事件，使得在點擊到btn按鈕的時候，alert('btn'),但是因為我 e.stopPropagation()阻止了事件冒泡，因此，就不會觸發toggleClas事件;而此時我點擊#box的時候，就是正常的toggleClass事件被觸發;
這里思考了一下，如果不用.on()該怎么解決，類似于原生js中，用addEventListener監聽點擊的target，代碼也不復雜：
$('#box‘).click(function(e) {
if (e.target == this) {
$(‘#btn').toggleClass(‘hid');
}
})
$(‘#btn').click(function() {
alert(‘btn');
})
這樣子，就能達到阻止事件冒泡的樣子了。
當然，事件冒泡也并非都是副作用，就是我們要講的另一種，那就是事件委托，事件委托就是建立在事件冒泡的基礎上的，比如上面那個例子，你可以假設#btn和#box之間有很多元素，當我想要點擊最里層的#btn的時候，想要觸發他對應的事件，那么，就可以通過點擊它的外圍元素，然后判斷點擊的是否是目標元素，也就是btn，如果是，那么觸發btn的事件，其實就是上面.on()的這個例子，可以改寫成：
$('body').on('click','#btn',function(e){
alert(‘btn');
})
把btn的事件委托給點擊body來處理。
最后再仔細的分析一下，其實事件委托和事件冒泡，從邏輯上來思考無非就是2個相反的方向在執行。事件委托其實就是事件捕獲過程，可以看成是從外到內捕獲的過程；而事件冒泡就是從里到外冒泡的過程。
jquery的冒泡事件的阻止與允許(三種實現方法)
冒泡或默認的事件發生,在某些時候是不需要的,在此就需要一些可以阻止冒泡和默認的事件的方法,本文介紹三種方法做到不同程度的阻止，感興趣的朋友可以了解下，或許對你了解冒泡事件有所幫助
有時我們不希望冒泡或默認的事件發生，這樣就需要一些jquery的的方法阻止冒泡和默認的事件了。
可以通過以下三種方法做到不同程度的阻止。
A：return false --->In event handler ,prevents default behavior and event bubbing 。
return false 在事件的處理中，可以阻止默認事件和冒泡事件。
B：event.preventDefault()---> In event handler ,prevent default event (allows bubbling) 。
event.preventDefault()在事件的處理中，可以阻止默認事件但是允許冒泡事件的發生。
C：event.stopPropagation()---> In event handler ,prevent bubbling (allows default behavior).。
event.stopPropagation()在事件的處理中，可以阻止冒泡但是允許默認事件的發生。
