Question

这是我的主播，

<a ID="lnkbtn0" class="page-numbers" href="#">1</a>
<a ID="lnkbtn1" class="page-numbers" href="#">2</a>
<a ID="lnkbtn2" class="page-numbers" href="#">3</a>
<a ID="lnkbtn3" class="page-numbers" href="#">4</a>

我的点击功能我正在添加一个cssclass来表明它是当前的锚点

$("a.page-numbers").click(function() {
                $(this).addClass('page-numbers current');
    });

当我点击下一个锚点时，会发生同一个类已添加到当前锚点和上一个锚点...可以执行哪些操作来删除cssclass page-numbers current并将cssclass page-numbers分配给以前/所有其他锚点而不改变当前的锚点....

Answer 1

为避免在整个dom中花费大量资金，请执行以下操作：

$("a.page-numbers").click(function() {
    $(this).addClass('current').siblings().removeClass('current');
});

Answer 2

跟进@ Danrumb的answer：

一个简单的解决方案是删除所有（一个）current的{{1}}类，然后将其添加到点击的类中：

a.page-numbers

Answer 3

$("a.page-numbers").click(function() {
    $("a.page-numbers.current").removeClass("current");
    $(this).addClass('current');
});

Answer 4

$("a.page-numbers").click(function() {
                $(this).addClass('current').siblings('a').removeClass('current');
    });

也是可能的，即使实际上不喜欢它。

Answer 5

'class'page-numbers class实际上是2个类：page-numbers和current。

要添加课程，您只需要

$(this).addClass('page-numbers');

要删除current类，您可以使用：

$(this).removeClass('current');

有关详细信息，请参阅the docs。

Answer 6

也许是这样的：

   $("a.page-numbers").click(function() {
                    $(this).addClass('current').prev('a').removeClass('current');
        });

假设前一个元素具有当前的类。

更好的方法是在点击时做两个阶段的事情：

1）循环遍历所有锚标记并从所有锚标记中删除当前类 2）将当前元素设置为具有类当前值。

这意味着您可以点击其中的任何一个，它应该可以正常工作

Answer 7

<a ID="lnkbtn0" class="page-numbers" href="#">1</a>
<a ID="lnkbtn1" class="page-numbers" href="#">2</a>
<a ID="lnkbtn2" class="page-numbers" href="#">3</a>
<a ID="lnkbtn3" class="page-numbers" href="#">4</a>

$("a.page-numbers").click(function() {
    $('a.page-numbers.current').removeClass('current');
    $(this).addClass('current');
});

您无需继续添加page-numbers，因为它已被添加。

如何从一个锚中删除CSS类并使用jquery将其分配给另一个锚？

7 个答案: