快捷導(dǎo)航

jquery 之 $().hover(func1, funct2)使用方法

更新時間：2012年06月14日 12:32:03 作者：

.hover(func1, func2) 的效果等效于： mouseenter(), mouseleave()

因?yàn)閔over不是標(biāo)準(zhǔn)的事件，因此無法直接使用live進(jìn)行處理，故使用以下方法代替，效果一樣。

 
$("<SPAN style="COLOR: #0000ff">table tr</SPAN>").live({ 
<SPAN style="BACKGROUND-COLOR: #99ccff">mouseenter:</SPAN> 
function() 
{ 
<SPAN style="COLOR: #008000">//todo</SPAN> 
}, 
<SPAN style="BACKGROUND-COLOR: #99ccff">mouseleave:</SPAN> 
function() 
{ 
<SPAN style="COLOR: #008000">//todo</SPAN> 
} 
}); 

在循環(huán)輸出的<div>中，只針對某個<div>下的內(nèi)容進(jìn)行處理的時：可以使用$(this).find()來實(shí)現(xiàn):

復(fù)制代碼代碼如下:

 
<body> 
<div class="<SPAN style="COLOR: #0000ff">water</SPAN>"> 
<div class="<SPAN style="COLOR: #0000ff">action</SPAN>" style="<SPAN style="COLOR: #3366ff">display:none</SPAN>"> 
<a href="#"><div class="left">{lang user/repick}</div></a> 
<a href="#"><div class="right">{lang user/reply}</div></a> 
</div> 
</div> 
<div class="<SPAN style="COLOR: #0000ff">water</SPAN>"> 
<div class="<SPAN style="COLOR: #0000ff">action</SPAN>" style="<SPAN style="COLOR: #3366ff">display:none</SPAN>"> 
<a href="#"><div class="left">{lang user/repick}</div></a> 
<a href="#"><div class="right">{lang user/reply}</div></a> 
</div> 
</div> 
<div class="<SPAN style="COLOR: #0000ff">water</SPAN>"> 
<div class="<SPAN style="COLOR: #0000ff">action</SPAN>" style="<SPAN style="COLOR: #3366ff; BACKGROUND-COLOR: #ffffff">display:none</SPAN>"> 
<a href="#"><div class="left">{lang user/repick}</div></a> 
<a href="#"><div class="right">{lang user/reply}</div></a> 
</div> 
</div> 
<div class="<SPAN style="COLOR: #0000ff">water</SPAN>"> 
<div class="<SPAN style="COLOR: #0000ff">action</SPAN>" style="<SPAN style="COLOR: #3366ff">display:none</SPAN>"> 
<a href="#"><div class="left">{lang user/repick}</div></a> 
<a href="#"><div class="right">{lang user/reply}</div></a> 
</div> 
</div> 

<script type="text/javascript"> 
$("<SPAN style="COLOR: #0000ff">.water</SPAN>").<SPAN style="COLOR: #800080">hover</SPAN>( 
function (){ 
$(this).<SPAN style="COLOR: #800080">find</SPAN>("<SPAN style="COLOR: #0000ff">.action</SPAN>").show(); 
}, 
function (){ 
$(this).<SPAN style="COLOR: #800080">find</SPAN>("<SPAN style="COLOR: #0000ff">.action</SPAN>").hide(); 
} 
) 
</script> 
</body> 

您可能感興趣的文章:

jquery
hover

相關(guān)文章

jQuery中:contains選擇器用法實(shí)例
這篇文章主要介紹了jQuery中:contains選擇器用法,以實(shí)例形式分析了:contains選擇器的功能、定義及匹配給定元素文本時的使用技巧,具有一定參考借鑒價值,需要的朋友可以參考下
2014-12-12
jQuery雙向列表選擇器select版
這個是select版的，若想美化某些樣式是不支持得，大家可以使用div模擬版，下面小編給大家介紹下jQuery雙向列表選擇器select版，感興趣的朋友一起看看吧
2016-11-11
jQuery對底部導(dǎo)航進(jìn)行跳轉(zhuǎn)并高亮顯示的實(shí)例代碼
這篇文章主要介紹了jQuery對底部導(dǎo)航進(jìn)行跳轉(zhuǎn)并高亮顯示的實(shí)例代碼，代碼簡單易懂，非常不錯，具有一定的參考借鑒價值 ,需要的朋友可以參考下
2019-04-04
javascript與jquery中跳出循環(huán)的區(qū)別總結(jié)
本文是對javascript與jquery中跳出循環(huán)的區(qū)別進(jìn)行了詳細(xì)的總結(jié)介紹，需要的朋友可以過來參考下，希望對大家有所幫助
2013-11-11
jQuery實(shí)現(xiàn)的鼠標(biāo)響應(yīng)緩沖動畫效果示例
這篇文章主要介紹了jQuery實(shí)現(xiàn)的鼠標(biāo)響應(yīng)緩沖動畫效果,涉及jQuery事件響應(yīng)、數(shù)值運(yùn)算及頁面元素動態(tài)操作相關(guān)技巧,需要的朋友可以參考下
2018-02-02
jQuery中 bind的用法簡單介紹
bind() 方法為被選元素添加一個或多個事件處理程序，并規(guī)定事件發(fā)生時運(yùn)行的函數(shù)。這篇文章主要介紹了jQuery中的 bind用法,需要的朋友可以參考下
2017-02-02
基于jQuery實(shí)現(xiàn)的當(dāng)離開頁面時出現(xiàn)提示的實(shí)現(xiàn)代碼
基于jQuery實(shí)現(xiàn)的當(dāng)離開頁面時出現(xiàn)提示的實(shí)現(xiàn)代碼，需要的朋友可以參考下。
2011-06-06
jQuery實(shí)現(xiàn)的網(wǎng)頁換膚效果示例
這篇文章主要介紹了jQuery實(shí)現(xiàn)的網(wǎng)頁換膚效果,結(jié)合完整實(shí)例形式分析了jQuery通過修改link標(biāo)簽的href屬性值實(shí)現(xiàn)換膚效果的相關(guān)技巧,需要的朋友可以參考下
2016-09-09
基于 jQuery 實(shí)現(xiàn)鍵盤事件監(jiān)聽控件
這篇文章主要介紹了基于 jQuery 的鍵盤事件監(jiān)聽控件,需要的朋友可以參考下
2019-04-04
jQuery如何跳轉(zhuǎn)到另一個網(wǎng)頁就這么簡單
這篇文章主要介紹了如何在jQuery中跳轉(zhuǎn)到另外一個網(wǎng)頁HTML，具有一定的參考價值，感興趣的小伙伴們可以參考一下
2016-12-12