jquery - 在 JQuery addclass 之后启用 href 导航

Question

我需要使用 jQueryaddClass来更改所选锚标记的样式。它工作正常。但是在更改样式后，我想导航到href. 这不起作用，因为我正在使用return false;or e.preventDefault()。

请帮我。

我正在使用的代码是：

$("li").click(function (e) {
    e.preventDefault();
    $("li").removeClass("active");
    $(this).addClass("active");
});

<div id="navigation" class="right">
    <ul>
        <li id="nav1"><a href="../WebForm1.aspx"><span>Home</span></a></li>
        <li id="nav2"><a href="../AboutUs.aspx"><span>About Us</span></a></li>
    </ul>
</div>

在单击主页链接后应用样式，但我希望它webform1.aspx在此之后导航到。

Answer 1

您需要检查您的li标签是否包含活动类，如果它已经转到指定的链接。

$("li").click(function (e) {
  if($(this).hasClass('active')){
      return true;
  }else{
    e.preventDefault();
    $("li").removeClass("active");
    $(this).addClass("active");
  }
});

演示

Answer 2

$("li a").click(function (e) {
    e.preventDefault();
    $(this).parent().parent().children("li").children("a").removeClass("active");
    $(this).addClass("active");
    document.location = $("a", this).attr("href");
});

Answer 3

演示：http: //jsfiddle.net/hBubq/1/

编辑<a href=""您可能需要在每个对象中使用绝对 URL

$("li").click(function (e) {
    e.preventDefault();
    $("li").removeClass("active");
    $(this).addClass("active");
    window.location.href =  $(this).find('a').attr('href');
});

​​​

<div id="navigation" class="right">
   <ul>
      <li id="nav1"><a href="../WebForm1.aspx"><span>Home</span></a></li>
      <li id="nav2"><a href="../AboutUs.aspx"><span>About Us</span></a></li>
   </ul>
</div>