jQuery切换未按预期工作

我有以下代码：

HTML

<dl class="dropdown right">
            <dt><a>Options</a></dt>
            <dd>
                <ul style="display:none;">
                    <li><a href="#">Link 1</a></li>
                    <li><a href="#">Link 1</a></li>
                    <li><a href="#">Link 1</a></li>
                </ul>
            </dd>
        </dl>

这个想法是用户点击选项，然后显示UL。这很好，但在第二次单击时，它不会再次隐藏菜单。。。你知道为什么吗？它肯定是在切换正确的菜单，但并不是在第二次单击时隐藏它：/

---

谢谢

这是因为您通过

隐藏ul。hide（）

：

---

这是因为您通过

隐藏ul。hide（）

：

---

我很抱歉，但我无法解释为什么它不能正常工作。。。不过，我能做的是用3行javascript重新编写代码：

$('dl.dropdown dt a').live('click', function () {

    $(this).closest('.dropdown').toggleClass('selected');

});

---

示例：

我很抱歉，但我无法解释为什么它不能正常工作。。。不过，我能做的是用3行javascript重新编写代码：

$('dl.dropdown dt a').live('click', function () {

    $(this).closest('.dropdown').toggleClass('selected');

});

示例：

注释掉该行：

 $('dl.dropdown dd ul').hide();

.toggle（）将为您打开和关闭菜单，因为您总是“隐藏”您的UL。toggle（）将始终打开菜单。

注释行：

 $('dl.dropdown dd ul').hide();

---

.toggle（）将为您打开和关闭菜单，因为您总是“隐藏”您的UL。toggle（）将始终打开菜单。

试试这个，效果非常好

$('dl.dropdown dt a').live('click', function () {

            var clicked = $(this);

            var toggleMenu = $(clicked).parents('dl').find('dd > ul');

            // Remove selcted class from all menus
            $('dl.dropdown dt a').toggleClass('selected');
            // Hide all Uls
            $('dl.dropdown dd ul').slideToggle();
            // and remove selected class for inner Lis
            $('dl.dropdown dd ul li').toggleClass('selected');
            // Toggle the menu on each click
            $(toggleMenu).toggle();
            // Toggle the class on the button
            $(clicked).toggleClass('selected');

        });

---

试试这个，它很好用

$('dl.dropdown dt a').live('click', function () {

            var clicked = $(this);

            var toggleMenu = $(clicked).parents('dl').find('dd > ul');

            // Remove selcted class from all menus
            $('dl.dropdown dt a').toggleClass('selected');
            // Hide all Uls
            $('dl.dropdown dd ul').slideToggle();
            // and remove selected class for inner Lis
            $('dl.dropdown dd ul li').toggleClass('selected');
            // Toggle the menu on each click
            $(toggleMenu).toggle();
            // Toggle the class on the button
            $(clicked).toggleClass('selected');

        });

---

试试这个，你应该给slideToggle一个机会

我通常用它来做这个用途

  $('#book').slideToggle('slow', function() {
    // Animation complete.
  });

---

你应该给slideToggle一个机会

我通常用它来做这个用途

  $('#book').slideToggle('slow', function() {
    // Animation complete.
  });