課程
/前端開(kāi)發(fā)
/jQuery
/jQuery基礎(chǔ)(三)—事件篇
什么是冒泡處理?
2016-12-20
源自:jQuery基礎(chǔ)(三)—事件篇 3-1
正在回答
冒泡處理:也可以從字面意思理解為,氣泡在水中會(huì)向上浮動(dòng)。那么我們現(xiàn)在就解釋什么是氣泡浮動(dòng)就好了。
氣泡:也就是所謂的觸發(fā)事件。
向上浮動(dòng):不僅會(huì)觸發(fā)自身的事件,而且還會(huì)一級(jí)一級(jí)地向上浮動(dòng)查找祖輩節(jié)點(diǎn)的同效果事件,直到根節(jié)點(diǎn)為止,沒(méi)完沒(méi)了。
舉例:在#div1 中有個(gè)子元素 #div2
定義:#div1 的mouseout事件; #div2 的mouseout事件
效果:當(dāng)觸發(fā)#div2 的mouseout事件時(shí),一定會(huì)觸發(fā)#div1 的mouseout事件。因?yàn)?div2觸發(fā)事件后,它還沒(méi)完,還會(huì)向上一級(jí)級(jí)查找祖輩們有沒(méi)有定義相同的mouseout事件,如果有就觸發(fā),這里顯然有定義#div1的mouseout事件,而且#div1還是#div2的父輩元素,所以會(huì)觸發(fā)#div1的mouseout事件。(這里說(shuō)的有點(diǎn)多,顯得有點(diǎn)累贅,主要是想讓你能理解。)
如果把mouseout事件 替換成 mouseleave事件就不會(huì)了,因?yàn)閙ouseleave事件,只會(huì)觸發(fā)自身的事件,不會(huì)冒泡祖輩們,讓他們安靜一點(diǎn)。
lxlacie 提問(wèn)者
舉報(bào)
jQuery第三階段開(kāi)啟事件修煉,掌握對(duì)頁(yè)面進(jìn)行交互的操作
7 回答什么是冒泡處理?
3 回答冒泡事件是怎么個(gè)冒泡法
2 回答什么叫冒泡啊
2 回答為什么會(huì)冒泡?
1 回答這也是冒泡?
Copyright ? 2025 imooc.com All Rights Reserved | 京ICP備12003892號(hào)-11 京公網(wǎng)安備11010802030151號(hào)
購(gòu)課補(bǔ)貼聯(lián)系客服咨詢(xún)優(yōu)惠詳情
慕課網(wǎng)APP您的移動(dòng)學(xué)習(xí)伙伴
掃描二維碼關(guān)注慕課網(wǎng)微信公眾號(hào)
2016-12-20
冒泡處理:也可以從字面意思理解為,氣泡在水中會(huì)向上浮動(dòng)。那么我們現(xiàn)在就解釋什么是氣泡浮動(dòng)就好了。
氣泡:也就是所謂的觸發(fā)事件。
向上浮動(dòng):不僅會(huì)觸發(fā)自身的事件,而且還會(huì)一級(jí)一級(jí)地向上浮動(dòng)查找祖輩節(jié)點(diǎn)的同效果事件,直到根節(jié)點(diǎn)為止,沒(méi)完沒(méi)了。
舉例:在#div1 中有個(gè)子元素 #div2
定義:#div1 的mouseout事件; #div2 的mouseout事件
效果:當(dāng)觸發(fā)#div2 的mouseout事件時(shí),一定會(huì)觸發(fā)#div1 的mouseout事件。因?yàn)?div2觸發(fā)事件后,它還沒(méi)完,還會(huì)向上一級(jí)級(jí)查找祖輩們有沒(méi)有定義相同的mouseout事件,如果有就觸發(fā),這里顯然有定義#div1的mouseout事件,而且#div1還是#div2的父輩元素,所以會(huì)觸發(fā)#div1的mouseout事件。(這里說(shuō)的有點(diǎn)多,顯得有點(diǎn)累贅,主要是想讓你能理解。)
如果把mouseout事件 替換成 mouseleave事件就不會(huì)了,因?yàn)閙ouseleave事件,只會(huì)觸發(fā)自身的事件,不會(huì)冒泡祖輩們,讓他們安靜一點(diǎn)。