jquery toggleClass只是兒童元素

Question

我有一個問題toggleclass只是兒童元素。

<ul class="sample-menu"> 
<li id="sample-topmenu_2"> 
    <a href="#" class="sample-icon">Menu Text</a> 
    <ul class="sample-submenu"> 
     <li class="submenu"><a href="#" class="sample-icon">Submenu Text</a></li> 
     <li class="submenu"><a href="#" class="sample-icon">Submenu Text</a></li> 
    </ul> 
</li> 
<li id="sample-topmenu_3"> 
    <a href="#" class="sample-icon">Menu Text2</a> 
    <ul class="sample-submenu"> 
     <li class="submenu"><a href="#" class="sample-icon">Submenu Text2</a></li> 
     <li class="submenu"><a href="#" class="sample-icon">Submenu Text2</a></li> 
    </ul> 
</li> 

我使用這個jQuery切換，但它撥動了所有菜單中的所有li元素。

$("*[id^=bga-topmenu_] p").click(function() { 
    $("li.submenu").toggleClass("sumenu_show"); 
}); 

我感謝您的幫助。

Answer 1

嘗試：

$("*[id^=bga-topmenu_]").click(function() { 
    $(this).find("li.submenu").toggleClass("sumenu_show"); 
}); 

您可以使用$(this)來獲取當前上下文（即點擊的元素），然後找到所有<li>元素與範圍內的子菜單class，使用.find()方法。