jQuery的live()方法對(duì)hover事件的處理示例
更新時(shí)間：2014年02月27日 14:50:53 作者：
一個(gè)模仿懸停事件的方法，當(dāng)鼠標(biāo)移動(dòng)到一個(gè)匹配的元素上面時(shí)，會(huì)觸發(fā)指定的第一個(gè)函數(shù)
hover([over,]out)
一個(gè)模仿懸停事件（鼠標(biāo)移動(dòng)到一個(gè)對(duì)象上面及移出這個(gè)對(duì)象）的方法
當(dāng)鼠標(biāo)移動(dòng)到一個(gè)匹配的元素上面時(shí)，會(huì)觸發(fā)指定的第一個(gè)函數(shù)。
當(dāng)鼠標(biāo)移出這個(gè)元素時(shí)，會(huì)觸發(fā)指定的第二個(gè)函數(shù)。
$('.myDiv').hover(function() {
doSomething...
}, function() {
doSomething...
});
而問(wèn)題是有些元素比如菜單是通過(guò)AJAX動(dòng)態(tài)加載的，hover方法執(zhí)行的時(shí)候
菜單還沒加載出來(lái)呢，所以就要用到j(luò)query的另一個(gè)方法live()
.live() 方法能對(duì)一個(gè)還沒有添加進(jìn)DOM的元素有效，是由于使用了事件委托：
綁定在祖先元素上的事件處理函數(shù)可以對(duì)在后代上觸發(fā)的事件作出回應(yīng)。
傳遞給 .live() 的事件處理函數(shù)不會(huì)綁定在元素上，
而是把他作為一個(gè)特殊的事件處理函數(shù)，綁定在 DOM 樹的根節(jié)點(diǎn)上。
$('.myDiv').live('hover',function(event){
if(event.type=='mouseenter'){
doSomething...
}else{
doSomething...
}
})
有的jquery版本響應(yīng)的是mouseenter和mouseleave
有的是mouseover和mouseout
待考證......
一個(gè)模仿懸停事件（鼠標(biāo)移動(dòng)到一個(gè)對(duì)象上面及移出這個(gè)對(duì)象）的方法
當(dāng)鼠標(biāo)移動(dòng)到一個(gè)匹配的元素上面時(shí)，會(huì)觸發(fā)指定的第一個(gè)函數(shù)。
當(dāng)鼠標(biāo)移出這個(gè)元素時(shí)，會(huì)觸發(fā)指定的第二個(gè)函數(shù)。
復(fù)制代碼 代碼如下:
$('.myDiv').hover(function() {
doSomething...
}, function() {
doSomething...
});
而問(wèn)題是有些元素比如菜單是通過(guò)AJAX動(dòng)態(tài)加載的，hover方法執(zhí)行的時(shí)候
菜單還沒加載出來(lái)呢，所以就要用到j(luò)query的另一個(gè)方法live()
.live() 方法能對(duì)一個(gè)還沒有添加進(jìn)DOM的元素有效，是由于使用了事件委托：
綁定在祖先元素上的事件處理函數(shù)可以對(duì)在后代上觸發(fā)的事件作出回應(yīng)。
傳遞給 .live() 的事件處理函數(shù)不會(huì)綁定在元素上，
而是把他作為一個(gè)特殊的事件處理函數(shù)，綁定在 DOM 樹的根節(jié)點(diǎn)上。
復(fù)制代碼 代碼如下:
$('.myDiv').live('hover',function(event){
if(event.type=='mouseenter'){
doSomething...
}else{
doSomething...
}
})
有的jquery版本響應(yīng)的是mouseenter和mouseleave
有的是mouseover和mouseout
待考證......
您可能感興趣的文章:
- 使用jquery給新生的th綁定hover事件的實(shí)例
- 淺談jQuery hover(over, out)事件函數(shù)
- jQuery hover事件簡(jiǎn)單實(shí)現(xiàn)同時(shí)綁定2個(gè)方法
- jquery中取消和綁定hover事件的實(shí)現(xiàn)代碼
- jQuery實(shí)現(xiàn)hover合成事件的方法
- JQuery中使用on方法綁定hover事件實(shí)例
- jQuery中多個(gè)元素的Hover事件解決方案
- jQuery 鼠標(biāo)經(jīng)過(guò)(hover)事件的延時(shí)處理示例
- 使用jquery hover事件實(shí)現(xiàn)表格的隔行換色功能示例
- 完美解決jQuery的hover事件在IE中不停閃動(dòng)的問(wèn)題
相關(guān)文章
jQuery中$.get、$.post、$.getJSON和$.ajax的用法詳解
本文重點(diǎn)是來(lái)講講jQuery中調(diào)用ajax的4種方法：$.get、$.post、$getJSON、$ajax。如果讀者沒有javascript和jquery的知識(shí)，或者沒有ajax的概念，那么請(qǐng)先去問(wèn)問(wèn)度娘，再來(lái)讀本文。2014-11-11
jquery實(shí)現(xiàn)圖片燈箱明暗的遮罩效果
這篇文章主要介紹了jquery實(shí)現(xiàn)圖片燈箱明暗的遮罩效果，有需要的朋友可以參考一下2013-11-11
jquery實(shí)現(xiàn)頁(yè)面常用的返回頂部效果
這篇文章主要為大家詳細(xì)介紹了jquery實(shí)現(xiàn)頁(yè)面常用的返回頂部效果代碼，感興趣的小伙伴們可以參考一下2016-03-03
jQuery 解析xml文件實(shí)現(xiàn)腳本代碼，用到了jquery如何解析xml文件，和大家分享一下2009-08-08
事件追加：點(diǎn)擊green元素會(huì)依次執(zhí)行g(shù)reen click1、green click2兩個(gè)事件（同一元素的同類型事件），感興趣的朋友可以參考下哈2013-04-04
本文依賴于jQuery,其中第一種，第二種方式是使用jQuery實(shí)現(xiàn)的，第三種方式是基于JS和DOM實(shí)現(xiàn)的，感興趣的朋友可以了解下2013-12-12
今天小編就為大家分享一篇關(guān)于jQuery AJAX與jQuery事件的分析講解，小編覺得內(nèi)容挺不錯(cuò)的，現(xiàn)在分享給大家，具有很好的參考價(jià)值，需要的朋友一起跟隨小編來(lái)看看吧2019-02-02
Confirmer JQuery確認(rèn)對(duì)話框組件
點(diǎn)擊鏈接或按鈕時(shí)要確認(rèn)是否繼續(xù)當(dāng)前操作。2010-06-06
jQuery實(shí)現(xiàn)下拉菜單動(dòng)態(tài)添加數(shù)據(jù)點(diǎn)擊滑出收起其他功能
這篇文章主要介紹了jQuery實(shí)現(xiàn)下拉菜單動(dòng)態(tài)添加數(shù)據(jù)點(diǎn)擊滑出收起其他功能，本文給大家介紹的非常詳細(xì),需要的朋友可以參考下2018-06-06
本篇文章主要是對(duì)jquery選擇器之屬性過(guò)濾選擇器進(jìn)行了介紹，需要的朋友可以過(guò)來(lái)參考下，希望對(duì)大家有所幫助2014-01-01