无法在移动视图中自动折叠导航

Question

为什么数据切换不起作用？按下时菜单保持打开状态！期待它关闭！有什么想法吗？

我不知道还能做什么!!谢谢

<!-- main nav -->
                <nav  id="navbar-collapse" class="collapse in navbar-collapse navbar-right" role="navigation">
                    <ul id="nav" class="nav navbar-nav">
                        <li><a style="color: #9d9d9d;" href="#body">Home</a></li>
                        <li><a style="color: #9d9d9d;" href="#about">About</a></li>
                        <li><a style="color: #9d9d9d;" href="#portfolio">Screenshots</a></li>
                        <li><a style="color: #9d9d9d;" href="#testimonials">Testimonials</a></li>
                        <li><a style="color: #9d9d9d;" href="#price">Features</a></li>
                        <li><a style="color: #9d9d9d;" href="#contact">Contact</a></li>
						<li><a style= "background-color: #2a7ead; color: #fff;"href="#yo">Buy Now</a></li>
					 </ul>
                </nav>
				<!-- /main nav -->



<div class="navbar-header" >
                    <!-- responsive nav button -->
					<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
						<span class="sr-only">Toggle navigation</span>
						<span class="icon-bar"></span>
						<span class="icon-bar"></span>
						<span class="icon-bar"></span>
                    </button>
					<!-- /responsive nav button -->
					
					<!-- logo -->
					
						<img style="padding-left: 7px;" src="img/logo.png" alt="logo">
					
					<!-- /logo -->
                </div>