在小屏幕和手机屏幕下，Bootstrap汉堡导航的自动折叠隐藏

最近在使用Bootstrap框架做网页时发现，在小屏幕和手机屏幕之下（max-width: 768px），导航栏不能在点击导航链接时，自动折叠导航栏。或者在展开导航栏后，如果不点击其中的导航链接，用户在选择滑动屏幕时，不能做到自动折叠导航栏。需要用户手动点击折叠按钮，才能收回去。这在小屏幕宝贵的显示面积内，显然不合理，用户体验也不好。

解决办法：

//点击导航之后隐藏
        $(window).scroll(function() {
            //小屏幕下的导航条折叠
            if($(window).width() < 768) {
                //点击导航链接之后，把导航选项折叠起来
                $("#navbar a").click(function() {
                    $("#navbar").collapse('hide');
                });
                //滚动屏幕时，把导航选项折叠起来
                $(window).scroll(function() {
                    $("#navbar").collapse('hide');
                });
            }
        });