WordPress切換邊欄子菜單

我有一個WordPress網站，在側邊欄中有一個菜單。我正在嘗試使「子菜單」部分切換。切換工作，但是當子菜單項本身被點擊時，切換子菜單不僅僅是父項，因此子菜單項的鏈接不起作用。WordPress切換邊欄子菜單

這是jQuery代碼：

jQuery(document).ready(function(){ 
    jQuery('#sidebar .menu .sub-menu').hide(); 
    jQuery('li.menu-item-has-children').click(function() { 
     jQuery(this).find('.sub-menu').toggle(); 
     return false; 
    }); 
});

這是HTML（我想切換「ul.sub菜單」部分）：

<aside id="sidebar"> 
    <div id="nav_menu-6" class="widget widget_nav_menu"><h3>Athletics</h3> 
     <div class="menu-athletics-container"> 
      <ul id="menu-athletics" class="menu"> 
       <li id="menu-item-641" class="menu-item menu-item-type-post_type menu-item-object-page current-menu-item page_item page-item-32 current_page_item menu-item-641"><a href="http://web2.gradelink.com/747/athletics/">Athletics</a></li> 
       <li id="menu-item-664" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-has-children menu-item-664 parent"><a href="#">Sports</a> 
        <ul class="sub-menu" style="display: none;"> 
         <li id="menu-item-665" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-665"><a href="http://web2.gradelink.com/747/athletics/baseball/">Baseball</a></li> 
         <li id="menu-item-666" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-666"><a href="http://web2.gradelink.com/747/athletics/basketball/">Basketball</a></li> 
         <!-- ... --> 
        </ul> 
       </li> 
       <li id="menu-item-675" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-675"><a href="http://web2.gradelink.com/747/athletics/athletic-forms-resources/">Athletic Forms &amp; Resources</a></li> 
       <!-- ... --> 
      </ul> 
     </div> 
    </div> 
</aside>

來源

2016-02-10 zarazha

您可以使用children與所要求的類別選擇任意子元素：

$('sub-menu').hide(); 
$('.menu').children().click(function(){ 
    event.preventDefault(); 
    $(this).children('.sub-menu li').slideToggle('slow');  
});

來源

2016-02-10 19:36:34 Trix

如何增加一些解釋？ – nottinhill

原來，自從li元素在等待一下，它應用於整個元素：

li Parent Object: Inspect Element selection

我通過應用點擊鏈接本身，然後利用家長和孩子走回頭路，切換子菜單固定它。

jQuery(document).ready(function(){ 
    jQuery('#sidebar .menu .sub-menu').hide(); 
    jQuery('#sidebar .menu-item-has-children a').click(function() { 
     jQuery(this).parent().children('.sub-menu').toggle(); 
    }); 
});

來源

2016-02-12 03:08:09 zarazha

WordPress切換邊欄子菜單

回答

相關問題