JQuery 删除和添加跨度类答案

【问题标题】：JQuery remove and add span-classJQuery 删除和添加跨度类
【发布时间】：2013-03-25 13:02:15
【问题描述】：

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

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>

JQuery：

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

但是它没有工作，它没有添加和删除类，我该如何解决这个问题？

【问题讨论】：

不清楚你在问什么，但我认为 parent() 不是正确的解决方案。
如果你使用 toggleClass() 而不是手动添加和删除类会更容易。
我一直遇到 .parent() 选择器没有按照您期望的那样做的问题。尝试用 .closest('.resCheck') 替换 .parent() - 我发现最近的选择器通常做同样的事情，如果你调整层次结构（如果需要在里面怎么办？另一个？），它通常仍能找到正确的元素。

标签： jquery html css

【解决方案1】：

试试这个

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

【讨论】：

它首先将类设置为单击，然后更改回第一个类。同样的事情。
@@SHUMAcupcake 现在检查一下

【解决方案2】：

试试这个...

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

Working DEMO

【讨论】：

【解决方案3】：

试试这个。

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

【讨论】：

【解决方案4】：

它确实有效，我想你是在错误地设置元素的样式还是什么？我添加了return false 以阻止链接正常运行。

jsFiddle

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

【讨论】：

我对代码所做的更改是return false，所以我可以测试它。删除它，它就是您问题中的确切代码。在我看来是正确的。

【解决方案5】：

试试这个

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

【讨论】：

【解决方案6】：

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

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

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

会做的:)

【讨论】：