Question

有没有办法更有效地编写以下代码？

请注意，此部分导航是CMS的一部分，并设置为隐藏，因此您不会看到它已展开。我有以下代码可以工作，即重新编写导航项并根据location.href添加一类当前但我希望它可以更有效地编写？

HTML

    <ul>
      <li><a class="current" href="#"><strong>Level 1</strong></a>
        <ul class="sub">
          <li><a class="" href="#">sub level</a></li>
          <li><a class="" href="#">sub level</a></li>
          <li><a class="" href="#">sub level</a></li>
        </ul>
      </li>
    </ul>

的jQuery

第一部分重写隐藏部分

 $(document).ready(function () {
$('menu li:eq(4)').html('<ul><li><a href="/level1" class="current"><strong>level1</strong></a>'
    +'<ul class="sub"><li><a href="/sub-level-a" class="">Sub Level A</a></li>'
    +'<li><a href="/sub-level-b" class="">Sub Level B</a></li>'
    +'<li><a href="/sub-level-c" class="">Sub Level C</a></li></ul></li></ul>');

}）;

添加课程

      $(document).ready(function () {
        if(window.location.href.indexOf("/ucpoolvehicles")!=-1)
                    {
        $("ul.sub li a:eq(0)").addClass("current");
                    } else {

        $("ul.sub li a:eq(0)").removeClass("current");
        }
        if(window.location.href.indexOf("/car-rental")!=-1)
                    {
        $("ul.sub li a:eq(1)").addClass("current");
                    } else {

        $("ul.sub li a:eq(1)").removeClass("current");
        }

        if(window.location.href.indexOf("/private-vehicle-usage")!=-1)
                    {
        $("ul.sub li a:eq(2)").addClass("current");
                    } else {

        $("ul.sub li a:eq(2)").removeClass("current");

        }

        });

我希望我明白我的指示提前致谢

Answer 1

这应该有效：

$(function() {
    $("ul.sub li a").removeClass("current");
    var href = window.location.href;
    if (href.indexOf("/ucpoolvehicles") != -1) {
        $("ul.sub li a:eq(0)").addClass("current");
    } else if (href.indexOf("/car-rental") != -1) {
        $("ul.sub li a:eq(1)").addClass("current");
    } else if (href.indexOf("/private-vehicle-usage") != -1) {
        $("ul.sub li a:eq(2)").addClass("current");
    }
});

Answer 2

这将没有隐藏部分

jQuery(document).ready(function ($) {
    alert(window.location.href);

    var url = window.location.href;

    // Will only work if string in href matches with location
    $('ul.sub li a[href="' + url + '"]').addClass('active');

    // Will also work for relative and absolute hrefs
    $('ul.sub li a').filter(function () {
        return this.href == url;
    }).addClass('active');
});

使用jquery根据location.href将类添加到href链接

2 个答案: