我正在尝试使用 javascript 来创建 Bootstrap <div class="navbar navbar-inverse navbar-fixed-top">我只需要更新 javascript 文件，而不是在网站的各个页面上管理导航栏。
这是横幅的代码:
document.write(
" <div class='navbar navbar-inverse navbar-fixed-top'>" +
" <div class='container'>" +
" <div class='navbar-header'>" +
" <button type='button' class='navbar-toggle' data-toggle='collapse' data-target='.navbar-collapse'>" +
" <span class='icon-bar'></span>" +
" <span class='icon-bar'></span>" +
" <span class='icon-bar'></span>" +
" </button>" +
" <a class='navbar-brand' href='link1.aspx'>My Website</a>" +
" </div>" +
" <div class='collapse navbar-collapse'>" +
" <ul class='nav navbar-nav'>" +
" <li><a href='link1.aspx'>Link 1</a></li>" +
" <li><a href='link2.aspx'>Link 2</a></li>" +
" <li><a href='link3.aspx'>Link 3</a></li>" +
" <li><a href='link4.aspx'>Link 4</a></li>" +
" <li><a href='link5.html'>Link 5</a></li>" +
" <li><a href='link6.aspx'>Link 6</a></li>" +
" </ul>" +
" </div>" +
" <!--/.nav-collapse -->" +
" </div>" +
" </div>"
);这是我试图设置当前页面导航栏的地方 <li>激活:
$(document).ready(function () {
$(".collapse navbar-collapse ul li a").each(function () {
if ($(this).attr("href") == window.location.pathname)
$(this).addClass("active");
})
})所有代码都位于 header.js 文件中，我从每个页面开始时调用该文件以显示标题:
<html>
<body>
<script type="text/javascript" src="Scripts/header.js"></script>
</body>
</html>问题是代码不起作用，我不知道为什么。我在声明 $(".collapse navbar-collapse ul li a")不正确？导航栏设置的方式不正确？
最佳答案
因为 collapse 和 navbar-collapse 在同一个元素中，所以你必须写
$(".collapse.navbar-collapse ul li a")
在提供的代码中没有包含 jQuery .js 文件，但我假设您在自己的代码中有该文件
关于javascript - 如何在 bootstrap collapse navbar-collapse 中将事件类添加到当前 <li>？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/31458625/