如何通過鏈接jQuery選擇器來選擇特定的div

Question

我在頁面上有10個div，並且所有div在div中具有相同的類「hoverable」，「contentDescription」和錨點標籤。當我將鼠標懸停在錨標籤上時，我希望錨標籤內的圖像發生更改。通過使用下面的函數，雖然圖像只改變了humble div，但是在firebug.ne​​t標籤中，我可以看到所有的div試圖加載「orangeLock.gif」。任何關於如何僅使當前histed div加載不同的圖標的輸入使用jQuery對下面的代碼進行一些小修改？

<div onmouseout="hideHover()" onmouseover="showHover(this)" class="relContainer hoverable" style="width: 710px; height: 140px; opacity: 1; display: block; background-color: rgb(255, 255, 255);"> 
    <div class="thumbContainer"></div> 
    <div class="contentDescription"> 
    <h2><a rel="doNothing" href="">Washington DC<img src="/images/lock.gif" name="a164a428047d96046a22db3373f057340"></a></h2></div> 
    </div> 



function showHover(div){ 
     jQuery('.hoverable .contentDescription a').mouseover(function() {   
        jQuery(this).find('img').attr('src', '/images/orangeLock.gif'); 
      }).mouseout(function(){ 
       jQuery(this).find('img').attr('src', '/images/lock.gif'); 
      }); 

    } 

![trying to load orangelock image][1] 

Answer 1

嘗試

function showHover(div){ 
    jQuery('.hoverable .contentDescription a').mouseover(function(ev) {   
       jQuery(ev.target).find('img').attr('src', '/images/orangeLock.gif'); 
     }).mouseout(function(ev){ 
      jQuery(ev.target).find('img').attr('src', '/images/lock.gif'); 
     }); 

}