javascript - 为什么 .toggle 对第一个函数不起作用？

Question

我创建了一个简单的菜单，其中有一个按钮，单击该按钮时应该会以交替的高度更改菜单的大小，我不断收到一些奇怪的操作，其中我的菜单只是缩小到文档的左下角然后消失重新出现相同的高度；这就是我发现第二个函数正在执行但第一个函数没有执行的方式。我已经多次更改代码，但找不到解决方案，也许有人可以提供帮助。这是我的代码。

$(document).ready(function () {
    $("#HideShow").addClass("fa fa-bars").click(function () {
        $("#editor").toggle(function () {
            $("#editor").slideToggle("fast", function () {
                $("#editor").height(20);
            });
        }, function () {
            $("#editor").slideToggle("fast", function () {
                $("#editor").height(150);
            });
        });
    });
});

也许我只是不明白，我对此还很陌生，所以如果我做错了什么，请纠正我。

Answer 1

我认为您不太了解 jQuery API。如果我理解正确的话，您可能应该使用打开和关闭菜单的类。然后您可以使用简单的 jQuery 事件来切换类。像这样的事情:

代码:

$('#HideShow').click(function() {
  $(this).toggleClass('closed');
});

CSS:

<style>
.closed {
  height: 20px;
}
</style>