jquery顯示列表項目

Question

我有兩個或多個無序列表，每個可見列表中的第一個列表項和其他隱藏列表項。

當第一個列表被點擊時，它應該顯示下面的所有其他li並隱藏在另一個ul中打開的其他li。

我似乎無法讓它顯示正確。

我無法改變我所擁有的例子中的類名，因爲它們是在覈心代碼內部深處生成的，並用於其他元素。

感謝您的任何幫助。

http://jsfiddle.net/ukkpower/En7KV/4/

Answer 1

試試這個：

$('ul').on('click','.maincat', 
      function(e){ 
       // prevents the default click action of the a element 
       e.preventDefault(); 

       // finds the sibling elements, and shows them if hidden, 
       // hides them if visible 
       $(this).siblings().toggle(); 

       // finds the closest ul ancestor of the clicked element 
       // finds the other ul siblings of that ancestor-ul 
       // finds the '.maincat' class element's siblings that are visible 
       // hides those visible elements 
       $(this) 
       .closest('ul') 
       .siblings('ul') 
       .find('.maincat') 
       .siblings('li:visible') 
       .hide(); 
      }); 

JS Fiddle demo。

---

編輯添加引用（如下圖），這注：

請注意，在jQuery 1.7中，live()方法已過時（和，因此，支持可以上可能將會刪除）。對於jQuery 1.7+，使用on()方法（請參閱下面的參考資料），並在1.7之前優先推薦delegate()方法。

我對本文的參考資料是live()的API文檔，請參閱參考資料。

請注意

參考文獻：

• closest()。
• delegate()。
• e.preventDefault()。
• find()。
• hide()。
• live()。
• on()。
• siblings()。
• toggle()。