javascript - 一个类的所有链接 - 如何在点击时添加额外的类？

Question

如果我有更多同一个类的链接，点击为活动项目添加额外的类，这是可能的吗？我试过 jquery '.toggleClass()' 但是如果我点击下一个链接，那么两个链接都有相同的类

<a href="link1.html">1</a>
<a href="link2.html">2</a>
<a href="link3.html">3</a>

我努力了：

$('a').click(function() { 
    $('a').toggleClass('active'); 
});

Answer 1

您需要使用this：

$('a').on('click', function(e) {
  e.preventDefault();
  $(this).toggleClass('active').siblings('a.active').removeClass('active');
});

因此，当单击锚点时，切换该active给定锚点上的类，并active从所有作为锚点且具有该类的兄弟姐妹中删除active该类。

这是一个小提琴

Answer 2

我在您的 html 中没有看到任何类，但我添加了一些作为示例。尝试这个：

html

<div class="menu">
<a href="link1.html">1</a>
<a href="link2.html">2</a>
<a href="link3.html">3</a>
</div>

jQuery

$('.menu a').click(function(){ //check thru all <a> elements  inside .menu
    $('.menu ').removeClass("active"); // remove all active class    
    $(this).addClass("active"); //put active in parent of <a> which was clicked
});

Answer 3

使用 addClass() 方法

$('.link').addClass('active');

Answer 4

单击其中一个链接后，从当前链接中删除活动类，然后添加到刚刚单击的链接。

    $('a').click(function()
    {
       $('.active').removeClass('active');
       $(this).addClass('active');
    });

Answer 5

首先从所有链接中删除活动类，然后将其添加到单击的元素上。

尝试这个 ：

jQuery('.link').click(function(e){
   e.preventDefault();
    var elem = jQuery(this);
    jQuery('.link').removeClass('active');
    elem.addClass('active');

});

这是演示

Answer 6

检查这个：

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

$('a').click(function(){
   $(this).addClass('yourClass');
});