Question

我有以下菜单，我正在尝试根据网址设置当前类，但它不起作用，有人知道为什么甚至更好的方法来实现这一点，谢谢： HTML -

 <ul class="dropdown">
                        <li><a id="home" href="/">Home</a></li>
                        <li>
                            <a id="hospitals" href="/hca-hospitals">HCA Hospitals</a>
                            <ul class="sub_menu">
                                <li id="one"><a  href="/hca-hospitals/hospitals-and-outpatients">Hospitals and Outpatients</a></li>
                                <li id="two"><a  href="/hca-hospitals/treatments">Treatments</a></li>
                            </ul>
                        </li>
                        <li>
                            <a id="benefits" href="/platinum-choice-benefits">Platinum Choice Benefits</a>
                            <ul class="sub_menu">
                                <li id="one"><a href="/platinum-choice-benefits/download-voucher">Download Voucher</a></li>
                                <li id="two"><a href="/platinum-choice-benefits/where-you-can-go">Where you can go</a></li>
                            </ul>
                        </li>
                        <li>
                            <a id="find" href="/find-a-hca-consultant">Find a Consultant</a>
                        </li>
                        <li>
                            <a id="contact" href="/contact-hca">Contact</a>
                        </li>
  </ul>

CSS -

ul.dropdown li a.current  { color: #66c2c0;}

JQuery -

  var pathname = $(location).attr('href');

       if (pathname = "/contact-hca") {
            $("ul.dropdown li a#contact").addClass("current");
           $("ul.dropdown li a#find").removeClass("current");
        }
       if (pathname = "/find-a-hca-consultant") {
           $("ul.dropdown li a#find").addClass("current");
           $("ul.dropdown li a#contact").removeClass("current");
       }

Answer 1

您使用=代替===，实际分配pathname，而不是比较它。解决这个问题。

if (pathname === "/contact-hca") {
  $("ul.dropdown li a#contact").addClass("current");
  $("ul.dropdown li a#find").removeClass("current");
} else if (pathname === "/find-a-hca-consultant") {
  $("ul.dropdown li a#find").addClass("current");
  $("ul.dropdown li a#contact").removeClass("current");
}

Answer 2

在您的代码中，您使用的是if (pathname = "/contact-hca")，这是错误的，因为=代表值赋值，并且您希望比较值的相等性，即==或{ {1}}。我建议你使用后者，因为它更快，它是字面上的比较，并且它更健壮，例如：

===

所以你应该改变你的代码：

5 == '5'  // true
5 === '5' // false

另外，我建议您学习如何使用开发人员的控制台（每个浏览器都有自己的控制台），这将帮助您确定代码中的问题所在和位置。

CSS当前类未被删除

2 个答案: