Javascript 下拉菜单的jQuery切换功能有问题

我有一个下拉菜单，当切换显示它的菜单项时，它会上下滑动。问题是，当我在菜单向下滑动后单击其中一个菜单项时，它会被识别为切换，菜单会向上滑动，而不会打开菜单项的链接

HTML

---

非常感谢您的帮助。

您为什么要单独关闭/打开菜单项？当父元素

被隐藏时，所有的东西都被隐藏了——为什么要在那之后做任何事情呢

我想你想

---

编辑1：你把事情复杂化了。试试这个：

$(document).ready(function () {
    $('.dropdown').toggle();
});

---

编辑2：你能更具体地说明你想要什么吗？如果要在单击时使用特定元素控制特定列表的运动，请尝试以下操作：

$(document).ready(function () {
    $('a.someLink').click(function() {
       $('.dropdown').toggle();
    });
});

---

尝试将触发链接移动到下拉项之外

<a href="#" class="dropdown">Carbohydrates, proteins &amp; fats</a>
<div class="divdropdown">
   <ul>
       <li><a href="carbohydrates.php">Carbohydrates</a></li>
       <li><a href="proteins.php">Proteins</a></li>
       <li><a href="fats.php">Fats</a></li>
   </ul>
</div>​

---

不幸的是，上述答案对我都不起作用。不久之后，我找到了一个解决办法

HTML

---

这个解决方案对我来说非常有效。我加入了

e.preventDefault（）

当我点击链接时，阻止页面上下跳跃。

我不知道你的意思是什么？我正在单独关闭/打开菜单项，因为我正试图这样做。我不知道你说“为什么要在那之后做任何事情”时指的是什么？我尝试了该代码，但它似乎隐藏了我的列表项-带有

class=“dropdown”

。当你单击一个链接（或其他元素）时，你想让它触发下拉/向上运动吗？对不起，我可能不够具体。如果您以我上面的例子为例，当我单击

时，我希望出现下拉列表。当我点击

碳水化合物

、

蛋白质

、或

脂肪

链接中的一个，它们将打开各自的链接。我还可以通过单击

再次切换关闭的下拉菜单。这就是我正在寻找的链接自定义CSS类并使用该CSS类作为jQuery选择器的行为（使用我上面的代码）。

$(document).ready(function () {
    $('a.someLink').click(function() {
       $('.dropdown').toggle();
    });
});

<a href="#" class="dropdown">Carbohydrates, proteins &amp; fats</a>
<div class="divdropdown">
   <ul>
       <li><a href="carbohydrates.php">Carbohydrates</a></li>
       <li><a href="proteins.php">Proteins</a></li>
       <li><a href="fats.php">Fats</a></li>
   </ul>
</div>​

$(document).ready(function () {
    $('.dropdown').toggle(
        function () {
            //show its submenu
            $('ul', $(".divdropdown")).slideDown(300);
        },
        function () {
            //hide its submenu
            $('ul', $(".divdropdown")).slideUp(300);        
        }
    );
});​

<li class="dropdown">
            <a class="disablelink" href="#">Carbohydrates, proteins &amp; fats</a>
            <ul class="sub_navigation">
                <li><a href="carbohydrates.php">Carbohydrates</a></li>
                <li><a href="proteins.php">Proteins</a></li>
                <li><a href="fats.php">Fats</a></li>
            </ul>
        </li>

$(document).ready(function() {
        $('.dropdown').click(function() {
                        // When the event is triggered, grab the current element 'this' and
                        // find it's children '.sub_navigation' and display/hide them
            $(this).find('.sub_navigation').slideToggle(); 
        });

        $(".disablelink").click(function(e) {
            e.preventDefault();
        });

    });