Question

我需要使用jQuery的addClass来更改所选锚标记的样式。它工作正常。但在更改样式后，我想导航到href中指定的链接。由于我使用return false;或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");
  }
});

DEMO

Answer 2

DEMO：http://jsfiddle.net/hBubq/1/

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

$("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>

Answer 3

$("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");
});

在JQuery addclass之后启用href导航

3 个答案: