將jQuery懸停事件綁定到多個DOM元素

Question

我有一個無序的元素列表，我想將懸停事件綁定到每個元素。 HTML結構如下：

<ul> 
    <li id="url_1">item 1</li> 
    <li id="url_2">item 2</li> 
</ul> 

我認爲使用for循環是最好的方法。所以我的jQuery代碼如下：

for(i=1;i<=2;i++){ 
    $("li#url_"+i).hover(function() { /* do something on mouseenter */}, function() { /* do something on mouseleave */ }); } 

這應該綁定懸停事件給李＃URL_1 &李＃url_2。但它不工作！

您能否建議正確（而且更有效率）的方式來做到這一點？

乾杯， 卡爾蒂克饒

Answer 1

第一，不要忘記把你的jQuery代碼$(document).ready(function { })塊裏面，所以它只能在DOM加載執行。

其次，爲什麼不分配ID，或class，或任何東西可以幫助你訪問UL元素在上面，然後做到這一點：

$("ul#yourId > li").hover(function() { ............. }, function() { ... }); 

，而不是建立一個循環。在事件處理程序中，使用this訪問li元素，並在需要時查看其id。 例如，事件處理程序將分配給所有li元素，它們是該ul元素的直接子元素，yourid爲id。