如何制作合适的jQuery下拉菜单？

朋友们好

当我最初单击

按钮
（图像）时，我对
向下滑动
菜单有问题，这是
它可以工作，但它
向下滑动
，然后立即向上滑动
，这是我不打算做的。例如，我的目标是使它具有响应性；如果用户单击该
按钮一次，它应该向下滑动；如果用户单击两次，它应该再次向上滑动

伙计们，我需要你们的帮助。我几乎不想这么做，但最终我无法让我的代码正常工作

这是我的HTML：

<a id='js-mnu' class='js-mnu'></a>
<a id="js-cat" class="js-cat"></a>

和jQuery：

$(document).ready(function(){
  $("#js-cat").click(function(){
       $('ul.catalog').slideDown();
    });
  $("#js-cat").click(function(){
       $('ul.catalog').slideUp();
    });
});

您正在绑定click事件两次。您应该只绑定一次，并检查菜单是否隐藏或不滑动或向下


$（文档）.ready（函数（）{
$（“#js cat”）。单击（函数（）{
var isHidden=$（“.menu”）.is（“：hidden”）；
如果（isHidden）{
$（'.menu'）.slideDown（）；
}否则{
$（'.menu'）.slideUp（）；
}
});
});
正文{
利润率：10px；
}
.菜单{
利润率：10px0；
背景：abcdef；
宽度：250px；
填充：10px；
}
a{
光标：指针；
边框：1px实心#555；
背景：#fafafa；
颜色：#555；
填充：10px；
显示：内联块
}

点击
内容：Lorem ipsum
$(document).ready(function(){
  $("#js-cat").click(function(){
       $('ul.catalog').slideDown();
    });
  $("#js-cat").click(function(){
       $('ul.catalog').slideUp();
    });
});