jquery - JQuery 删除和添加跨度类

Question

我有两个带有用户可以单击的链接的跨度，当单击一个跨度时，它会删除一个类并在单击一个上添加另一个类：

HTML：

<span class="resCheck label label-success">
  <a data-method="get" class="resCheckLink" href="trafikskola?utf8=%E2%9C%93&amp;query=lund&     
   amp;sort=asc">Cheap prices</a>
</span>
<span class="resCheck label">
  <a class="resCheckLink" data-method="get" href="trafikskola?utf8=%E2%9C%93&query=lund&  
  sort=desc">Expensive prices</a>
</span>

查询：

$(function(){
    $('.resCheckLink').click(function(e){
        $('.resCheck.label').removeClass('label-success');
        $(this).parent().addClass('label-success')
    });
});

但是它不起作用，它不会添加和删除类，我该如何解决这个问题？

Answer 1

尝试这个

$(function(){
    $('.resCheckLink').click(function(e){
        $('.resCheck').removeClass('label-success');
       $(this).parent().addClass('label-success');
    });
});

Answer 2

尝试这个...

$(function(){
    $('.resCheckLink').click(function(e){
        $('.resCheck').removeClass('label-success');
        $(this).parent().addClass('label-success');
    });
});

工作演示

Answer 3

您正在删除和添加相同的类，因此您将无法实际监控，

$('.resCheck.label').removeClass('label-success');
    $(this).parent().addClass('label-success');

所以请创建另一个具有不同风格的课程，然后尝试，上面的 PSR 给出了答案。

那会做的:)

Answer 4

尝试这个。

$(function(){
    $('.resCheckLink').click(function(e){
        $('span.resCheck').removeClass('label-success');
        $(this).parent().addClass('label-success')
    });
});

Answer 5

它确实有效，我想你的元素样式不正确还是什么？我添加return false以防止链接正常工作。

jsFiddle

$(function(){
    $('.resCheckLink').click(function(e){
        $('.resCheck.label').removeClass('label-success');
        $(this).parent().addClass('label-success');
        return false;
    });
});

Answer 6

尝试这个

$(function(){
   $('.resCheckLink').click(function(e){
         $('.resCheck').removeClass('label-success');
         $(this).parent().addClass('label-success')
   });
});