gpt4 book ai didi

javascript - 如何在 bootstrap collapse navbar-collapse 中将事件类添加到当前
  • 转载 作者:行者123 更新时间:2023-11-28 07:31:55 26 4
    gpt4 key购买 nike

    我正在尝试使用 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")不正确?导航栏设置的方式不正确?

    最佳答案

    因为 collapsenavbar-collapse 在同一个元素中,所以你必须写

    $(".collapse.navbar-collapse ul li a")

    在提供的代码中没有包含 jQuery .js 文件,但我假设您在自己的代码中有该文件

    关于javascript - 如何在 bootstrap collapse navbar-collapse 中将事件类添加到当前 <li>?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31458625/

    26 4 0
    Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
    广告合作:1813099741@qq.com 6ren.com