0
我正在創建一個導航欄，當屏幕大小低於某個寬度時顯示一個按鈕;就像您在其他許多Bootstrap方面看到的一樣。當顯示並單擊該按鈕時，導航鏈接將顯示爲一個垂直下拉菜單，其按預期工作。BootStrap「navbar-toggle」類將打開，但不會關閉
當我嘗試通過重新點擊鏈接關閉下拉菜單時，問題就出現了。無論我做什麼，它都保持開放。在檢查實時網站之後，看起來類'in'是在第一次點擊時添加的，但在隨後的點擊（切換功能）中不會被刪除。我不知道如何糾正這個問題，因爲我相信我的鏈接在標題中是正確的。有沒有人有任何這個問題的經驗？
編輯：作爲澄清，我明白我可以在我的JavaScript文檔中編寫解決方法，但如果有更明顯的解決方案，我不想沿着該路徑走下去。感謝您幫助初學者。
<html>
<head>
<meta charset="utf-8">
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1" />
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<link href="<?php echo get_bloginfo('template_directory'); ?>/javascipt/main.js"> <!-- personal JS Script (Not Sure which is better) Icons -->
<link href="<?php echo get_bloginfo('template_directory'); ?>/font-awesome-4.7.0/css/font-awesome.css" rel="stylesheet"> <!-- Font Awesome Icons -->
<link href="<?php echo get_bloginfo('template_directory'); ?>/style.css" rel="stylesheet"> <!-- Personal CSS Stylesheet -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="<?php echo get_bloginfo('template_directory'); ?>/javascript/main.js"></script> <!-- Personal JS Script -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js">
</script> <!-- Bootstrap Script -->
<title><?echo get_bloginfo('name'); ?></title>
<?php wp_head(); ?>
</head>
<body>
<div class="main contain">
<nav class="navbar navbar-inverse hold-top">
<div class="container-fluid">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand nav-logo2" href="<?php echo get_bloginfo('wpurl'); ?>"></a>
</div>
<div class="collapse navbar-collapse pull-right header-text" id="myNavbar">
<ul class="nav navbar-nav">
<li class="active"><a href="#">Home</a></li>
<li class="dropdown">
<a class="dropdown-toggle" data-toggle="dropdown" href="#">Services<span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href="#">Marketing Campaigns</a></li>
<li><a href="#">Donor Activation</a></li>
<li><a href="#">Lobbying</a></li>
</ul>
</li>
<li><a href="#">Our Team</a></li>
<li><a href="#">Contact Us</a></li>
</ul>
<ul class="nav navbar-nav navbar-right">
<li><a href="#"><span class="glyphicon glyphicon-user">
</span> Sign Up</a></li>
<li><a href="#"><span class="glyphicon glyphicon-log-in">
</span> Login</a></li>
</ul>
</div>
</div>
</nav>