通过导航

Question

我正在编写代码

<div class="tslcNav" role="navigation">
        <div class="navbar-collapse collapse">
            <ul class="nav navbar-nav">
                <li><a href="index.html">Home</a></li>
                <li><a href="mngPost.html">Manage Portfolio</a></li>
                <li><a href="riskAssesment.html">Risk Assessment</a></li>
                <li><a href="security_setup.html">Security Setup</a></li>
                <li><a href="dataOwner-riskAssessmentCompliance.html"style="visibility: hidden"></a></li>
            </ul>
        </div>
    </div>

另外

<script type="text/javascript">
    $(function() {
        var pgurl = window.location.href.substr(window.location.href
                .lastIndexOf("/") + 1);
        $(".tslcNav ul li a").each(
                function() {
                    if(pgurl=="dataOwner-riskAssessmentCompliance.html")
                        $("riskAssesment.html").addClass("active");
                    if ($(this).attr("href") == pgurl
                            || $(this).attr("href") == '')
                        $(this).closest('li').addClass("active");
                })          
    });

但是当我在dataOwner-riskAssessmentCompliance.html页面时，它没有激活标签。当我在riskAssesment.html页面时，它应该激活标签dataOwner-riskAssessmentCompliance.html。这段代码出了什么问题？

Answer 1

您使用了错误的选择器，您应该将href与页面名称一起使用，

if(pgurl=="dataOwner-riskAssessmentCompliance.html")
    $("[href='riskAssesment.html']").addClass("active");

我认为您要将active类添加到其父li，

$(function() {
    var pgurl = window.location.href.substr(window.location.href
            .lastIndexOf("/") + 1);
    $(".tslcNav ul li a").each(function() {
        if(pgurl=="dataOwner-riskAssessmentCompliance.html"){
            $("[href='riskAssesment.html']").addClass("active")
                                            .closest('li').addClass('active');
        }
        else {
            if ($(this).attr("href") == pgurl || $(this).attr('href') == '')
                $(this).closest('li') // get the closest li
                       .addClass("active"); // add active class to that li
        }
    });
});

Answer 2

为了添加课程，您需要使用href作为

来访问选择器

$("[href='riskAssesment.html']").addClass("active");

Answer 3

你需要这个

var pgurl = window.location.href.substr(window.location.href.lastIndexOf("/") + 1);
$('ul.nav > li').removeClass("active");
$("a[href='"+pgurl+"']").parent().addClass("active");

Answer 4

  $(document).ready(function () {
            var url = window.location.toString().split('?');

            $('ul.nav li a').filter(function () {
                if (this.href != '') {
                    if (this.href == url[0]) {
                        $(this).parent().addClass('active');
                    }
                }
            });
        });

我希望它可以帮到你。