針對一個懸停列表項目的'a'兄弟

Question

我在我的網站上嵌套導航。它看起來是這樣的：

<ul> 
    <li><a>Main Link 1</a> 
    <ul> 
     <li>Sublist Item of Main Link 1</li> 
    </ul> 
    </li> 

    <li><a>Main Link 2</a> 
    <ul> 
     <li>Sublist Item of Main Link 2</li> 
    </ul> 
    </li> 


</ul> 

我想只針對a鏈接時，它的兄弟姐妹，在這種情況下，ul，孩子們徘徊。我試圖用jQuery來實現，但找不到合適的解決方案。

在此先感謝

Answer 1

如果你添加一些識別類的HTML：

<ul> 
    <li><a class="mainLink">Main Link 1</a> 
    <ul class="linkHoverTarget"> 
     <li>Sublist Item of Main Link 1</li> 
    </ul> 
    </li> 

    <li><a class="mainLink">Main Link 2</a> 
    <ul class="linkHoverTarget"> 
     <li>Sublist Item of Main Link 2</li> 
    </ul> 
    </li> 
</ul> 

您可以懸停事件註冊，然後去那些徘徊像這樣的活動的相應鏈接：

$(".linkHoverTarget li").hover(
    function() { 
     // get the link in a sibling of our parent ul 
     $(this).parent().parent().find(".mainLink"); 
    } 
); 

這可能可以用更復雜和脆弱的選擇器來完成，而不需要添加標識類，但它肯定不是很清楚，可以這樣做。