如何让导航栏切换按钮在第一次单击时向下拉，而不是下降，消失，然后必须再次单击？

Question

当我的站点在小屏幕上显示导航栏折叠的切换按钮时，我编写了一些jquery来在单击菜单项时隐藏导航栏，然后再次单击导航栏切换按钮时，我想让它简单地再次显示出来，这样用户就可以选择另一个菜单项。发生的情况是，在第一个hide()事件之后，需要单击两次导航栏切换按钮才能显示菜单。我怎么才能得到它，只需要一次点击？以下是网站的代码和链接：

 $('.select').on('click', function() {
      $('#navigation').hide();
    });

    $('.navbar-toggle').on('click', function() {
      $('#navigation').show();
    });

http://mattparmanswebsites.herokuapp.com/ (缩小屏幕宽度低于700以查看折叠的菜单问题)

Answer 1

尝试使用.toggle函数显示/隐藏#navigation。

$('.select').on('click', function() {
    $('#navigation').toggle();
});

这是一个example。

Answer 2

只需切换事件：

$(".select").click(function(){
    $("#navigation").toggle();
});