遍歷列表元素，並添加類如果列表元素包含另一個列表

這裏很簡單的問題，但它一直在困擾我一點。遍歷列表元素，並添加類如果列表元素包含另一個列表

我有一個摺疊式菜單設置，如下所示：

<ul id="menu" class="navigation"> 
    <li><a href="#"><span>Dashboard</span></a> 
     <ul> 
      <li><a href="#">Dashboard</a></li> 
      <li><a href="#">Articles &amp; Posts</a></li> 
      <li><a href="#">Pages</a></li> 
     </ul> 
    </li> 
    <li><a href="#"><span class="icon_articles">Articles &amp; Posts</span></a> 
     <ul> 
      <li><a href="#">Dashboard</a></li> 
      <li><a href="#">Articles &amp; Posts</a></li> 
      <li><a href="#">Pages</a></li> 
     </ul> 
    </li> 
    <li><a href="#"><span class="icon_pages">Pages</span></a></li> 
    <li><a href="#"><span class="icon_media">Media Gallery</span></a> 
     <ul> 
      <li><a href="#">Dashboard</a></li> 
      <li><a href="#">Articles &amp; Posts</a></li> 
      <li><a href="#">Pages</a></li> 
     </ul> 
    </li> 
    <li><a href="#"><span class="icon_calendar">Calendar</span></a></li> 
    <li><a href="#"><span class="icon_demos">Features &amp; Demos</span></a> 
     <ul> 
      <li><a href="#">Dashboard</a></li> 
      <li><a href="#">Articles &amp; Posts</a></li> 
      <li><a href="#">Pages</a></li> 
     </ul> 
    </li> 
    <li><a href="#"><span class="icon_settings">Settings</span></a></li> 
    <li><a href="#"><span class="icon_logout">Logout</span></a></li> 
</ul>

而且我已經得到了運行手風琴jQuery腳本：

function accordionMenu() { 
$('ul.navigation ul').hide(); 
$('ul.navigation li a').click(
    function() { 
     var parentElement = this.parentNode.parentNode.id; 
     var elementTest = $(this).next(); 

     if((elementTest.is('ul')) && (elementTest.is(':visible'))) { 
      $('#' + parentElement + ' ul:visible').slideUp('fast'); 
      $(this).removeClass('active'); 
      return false; 
     } 
     if((elementTest.is('ul')) && (!elementTest.is(':visible'))) { 
      $('#' + parentElement + ' ul:visible').slideUp('fast'); 
      elementTest.slideDown('fast'); 
      $('ul.navigation a').removeClass('active'); 
      $(this).addClass('active'); 
      return false; 
     } 
    } 
); 
} 

$(document).ready(function() {accordionMenu();});

現在我需要弄清楚如何循環瀏覽列表項目，並找到列表項目後面的列表項目（即單擊時，下拉列表以顯示隱藏列表）。然後我需要在每個結尾添加一個跨度（介於< />和< ul>之間）。就是這樣。這只是讓我感到困惑 - 我該怎麼去做呢？

感謝，

亞歷

來源

2012-02-06 Alex Cowley

問題的標題說你想添加一個類，但問題本身說明你想追加一個''元素 - 這是什麼？ – 2012-02-06 16:06:57

$('ul.navigation').children().has("ul").each(function(){ 
    $(this).children("a").append("<span>test</span>");    
});

這應該工作:)你的項目好運氣。

來源

2012-02-06 16:18:08

$("#menu ul").each(function(){ 
    $(this).closest("li").addClass("whatever_class_you_need") 
     .find("a").first().after("<span>something goes here</span>"); 
});

來源

2012-02-06 16:03:20 bububaba

的:has選擇最適合這個場景。

$("#menu li:has(ul)").addClass("hasSubMenu");

來源

2012-02-06 16:04:47

您可以試試這個。

$('ul.navigation li').filter(function(){ 
    return $(this).children('ul').length > 0; 
}).each(function(){ 
    $(this).find('a').after('<spam />'); 
}) 
.addClass('className');

來源

2012-02-06 16:05:54 ShankarSangoli

遍歷列表元素，並添加類如果列表元素包含另一個列表

回答

相關問題