接受數(shù)據(jù)參數(shù)--解決不同作用域下數(shù)據(jù)傳遞的問題

　　<div id="test">點擊觸發(fā)</div>

　　$('#test').click('001',function(e){

　　　　　　alert(e.data)　　//彈出001

　　});

mouseenter與mouseover(mouseout與mouseleave)的區(qū)別---關(guān)鍵是冒泡的方式處理問題

　　<div>

　　　　<p></p>

　　</div>

　　如果在div與p中都綁定mouseover，鼠標在離開p但沒離開div時，出現(xiàn)p與div都響應事件，因為先觸發(fā)p然后冒泡。

　　mouseenter事件只會在綁定它的元素上被調(diào)用，不會在后代節(jié)點上被觸發(fā)。。

foucus(blur)與foucusin(foucusout)的區(qū)別---是否支持冒泡處理

　　前者不冒泡，或者冒泡

hover方法

　　$(selector).hover(handlerIn, handlerOut)

• handlerIn(eventObject)：當鼠標指針進入元素時觸發(fā)執(zhí)行的事件函數(shù)
• handlerOut(eventObject)：當鼠標指針離開元素時觸發(fā)執(zhí)行的事件函數(shù)

　　$("p").hover(
　　　　　　function() {
　　　　　　　　$(this).css("background", 'red');
　　　　　　},
　　　　　　function() {
　　　　　　　　$(this).css("background", '#bbffaa');
　　　　　　}
　　);

on()的多事件綁定?on( events [, selector ] [, data ] )

　　多個事件綁定同一函數(shù)

　　　　$('*').on('mouseover mouseout',function(){});

　　多個事件綁定不同函數(shù)

　　　　$(*).on({

　　　　　　mouseover:function(){},

　　　　　　mouseout:function(){},

　　　　});

　　將數(shù)據(jù)傳遞到處理程序

　　　　$('*).on('click',{name:'my',age:'36'},function(e){

　　　　　　alert(e.data.name);

　　　　})

　　委托機制

　　　　.on(events,[,selector][,data],handler(eventObject))

　　　　如：

　　　　　　<div>

　　　　　　　　<p>

　　　　　　　　　　<a>目標節(jié)點</a>

　　　　　　　　</p>

　　　　　　</div>

　　　　$('div').on('click','p',fn)

　　　　　事件綁定在最上層div元素上，當用戶觸發(fā)在a元素上，事件將往上冒泡，一直會冒泡在div元素上。如果提供了第二參數(shù)，那么事件在往上冒泡的過程中

　　　　　遇到了選擇器匹配的元素，將會觸發(fā)事件回調(diào)函數(shù)。

　　事件委托

　　　　利用瀏覽器的冒泡特性，給父元素綁事件，用e.target判斷被觸發(fā)的元素，做相應的function。

　　　　（e:事件對象---是用來記錄一些事件發(fā)生時的相關(guān)信息的對象。只在事件發(fā)生時產(chǎn)生，只能是事件處理函數(shù)內(nèi)部訪問，在所有事件處理函數(shù)運行結(jié)束后，

　　　　　　事件對象就被銷毀）。

　　jQuery事件屬性方法

　　　　e.type/pageX/pageY/preventDefault()/stopPropagation()/which/currentTarget(等同于this).

　　　　this與e.target的區(qū)別：

　　　　　　　　冒泡過程中this是可以變化的，但e.target永遠是直接接受事件的目標DOM元素

　　　　this與e.target都是dom對象，用jq需要轉(zhuǎn)換為$(this),$(e.target)

trigger事件--根據(jù)綁定到匹配元素的給定的事件類型執(zhí)行所有的處理程序和行為

　　　$('#elem').trigger('click') //不同點擊直接運行click時的fn。

　　　trigger還支持自定義事件，支持傳遞參數(shù)

　　　　　　$('#elem').on('Aaron',function(e,arg1,arg2){

　　　　　　　　alert('自觸自定義事件')

　　　　　　});

　　　　　　$('#elem').trigger('Aaron',['參數(shù)1','參數(shù)2']);

trigger觸發(fā)瀏覽器事件與自定義事件的區(qū)別：

　　　自定義事件對象，是jQuery模擬原生實現(xiàn)的

　　　自定義事件可以傳遞參數(shù)

triggerHandler--觸發(fā)通過 jQuery 綁定的事件處理函數(shù)，而不觸發(fā)原生的事件

　　　trigger與triggerHandler用法一樣，不同點：

• riggerHandler不會觸發(fā)瀏覽器的默認行為，.triggerHandler( "submit" )將不會調(diào)用表單上的.submit()
• .trigger() 會影響所有與 jQuery 對象相匹配的元素，而 .triggerHandler() 僅影響第一個匹配到的元素
• 使用 .triggerHandler() 觸發(fā)的事件，并不會在 DOM 樹中向上冒泡。 如果它們不是由目標元素直接觸發(fā)的，那么它就不會進行任何處理
• 與普通的方法返回 jQuery 對象(這樣就能夠使用鏈式用法)相反，.triggerHandler() 返回最后一個處理的事件的返回值。如果沒有觸發(fā)任何事件，會返回 undefined

轉(zhuǎn)載于:https://www.cnblogs.com/sao-di-seng/p/5488987.html

總結(jié)

以上是生活随笔為你收集整理的jq事件注意点的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。