Question

在.click元素的<a>事件上，我添加了一个类my-selected-item。

但是该类仅在.click事件中影响。我读到我可以使用函数event.preventDefault处理此问题。但这导致<a>元素不会触发href=""链接。

$(document).ready(function () {
    $("a.seaw-menu-item").click(function () {
        $(this).addClass('my-selected-item');
    });
});

似乎我错过了一点。感谢您的帮助！

EDIT：//

它是用于菜单目的。

<div class="myMenu">
  <a href="myPage.php?subpage=mySubPage1" class="seaw-menu-item">MenuItem 1</a>
  <a href="myPage.php?subpage=mySubPage2" class="seaw-menu-item">MenuItem 2</a>
  <a href="myPage.php?subpage=mySubPage3" class="seaw-menu-item">MenuItem 3</a>
</div>

Answer 1

我只能猜测，但我相信您想要这样的东西：

添加一个id为“ someContainer”的div，并将href中的页面内容（假定相同的原点）加载到其中，并设置类集

使用您的HTML：

    $(document).ready(function() {
      $("a.seaw-menu-item").on("click", function(e) {
        e.preventDefault();
        $("a.seaw-menu-item").removeClass('my-selected-item'); // remove from all links
        console.log("This would load:"+this.href+" into someContainer");
        $("#someContainer").load(this.href); // load the page
        $(this).addClass('my-selected-item'); // set the class on this link
      });
    });

a { text-decoration:none }
a.my-selected-item { text-decoration: underline }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div class="myMenu">
  <a href="myPage.php?subpage=mySubPage1" class="seaw-menu-item">MenuItem 1</a>
  <a href="myPage.php?subpage=mySubPage2" class="seaw-menu-item">MenuItem 2</a>
  <a href="myPage.php?subpage=mySubPage3" class="seaw-menu-item">MenuItem 3</a>
</div>
<div id="someContainer"></div>

Answer 2

您的问题不是很清楚，但这是您想要的吗？

$(document).ready(function () {
    $("a").on("click", '*:not(a)', function() {
        $(this).addClass('my-selected-item');
        e.preventDefault();
    });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<a href="https://stackoverflow.com"> the link works </a>

jQuery click事件添加类

EDIT：//

2 个答案: