使用JQuery单击另一个父菜单项时如何折叠子菜单 [英] How to collapse a submenu when another parent menu item is clicked with JQuery

问题描述

我只是想让您的大脑有点问题，我正在使用jquery设置可折叠菜单.我目前正在使用slideToggle()函数通过菜单单击来使拼贴变得生动，它可以独立地关闭和打开子菜单.但是我试图找出一种方法，使子菜单在另一个菜单打开时折叠.任何建议/提示将不胜感激.

Just wanted to pick your brains a bit with this problem I'm having setting up a collapsible menu using jquery. I'm currently using the slideToggle() function to animate the collasping with a menu click, it works for closing and opening submenus independently. But I'm trying to figure out a way to have the submenus collapse when another opens. Any suggestions/tips would be greatly appreciated.

jQuery

<script>
     function initMenu() {
       $('#menu ul').hide(); 
       $('#menu li a').click(

       function() {
         $(this).next().slideToggle('normal')

       });

     }
     $(document).ready(function() {initMenu();});
    </script>

HTML

<ul id="menu">

     <li><a href="#">Home</a></li>
     <li><a href="#">In the news</a>

        <ul>
          <li><a href="#">Youtube</a></li>
          <li><a href="#">Blog</a></li>

        </ul>
     </li>

     <li><a href="#">Who's Who?</a>
         <ul>
           <li><a href="#">Youtube</a></li>
           <li><a href="#">Tackle Hunger Tackle  Hunger</a></li>
        </ul>
    </li>
     <li><a href="#">Services Offered</a></li>

 </ul>

谢谢

安德烈

推荐答案

这是一个有效的示例.

function initMenu() {
    $('#menu ul').hide(); 
    $('#menu > li > a').on('click', function() {
        $('#menu ul').slideUp();
        $(this).next().slideDown();
    });
}
$(document).ready(initMenu);

这篇关于使用JQuery单击另一个父菜单项时如何折叠子菜单的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！