javascript - 如何在按下键时显示元素，然后如果再次按下，隐藏元素？

Question

我有一个元素，其中有一个可以使用 [Ctrl] + [Z] 切换的侧边菜单。我希望它在下次按下 [Ctrl] + [Z] 模式时隐藏。我对 JavaScript 的平庸知识阻碍了我使用谷歌来表达它，所以我最终没有找到任何东西，所以我来到这里。鉴于 JavaScript 的数量，我知道这技术上 应该可行，但逻辑上 行不通。有任何想法吗？这是我的代码:

var letter = {
    z: 90
    ...

};

$(document).ready(function() {

    $("body").keydown(function(event) {

            // toggles element the first time
        if(event.ctrlKey && event.which === letter.z) {
            $("[data-location='top']").slideDown("fast");
            $("[data-location='bottom']").slideDown("fast");
        }

            // hides element the second time
        if(event.ctrlKey && event.which === letter.z) {
            $("[data-location='top']").slideUp("fast");
            $("[data-location='bottom']").slideUp("fast");
        }

    });

});

任何帮助将不胜感激! :-)

Answer 1

.slideToggle() 函数正是您要找的。

var letter = {
    z: 90
    ...

};

    $(document).ready(function() {

        $("body").keydown(function(event) {

            if(event.ctrlKey && event.which === letter.z) {
                $("[data-location='top']").slideToggle("fast");
                $("[data-location='bottom']").slideToggle("fast");
            }

        });

    });