jquery问题onclick添加类和删除类答案

【问题标题】：Jquery problem onclick add class and remove classjquery问题onclick添加类和删除类
【发布时间】：2011-06-11 19:39:46
【问题描述】：

第一次在这里发帖。我是 jquery 的初学者，我遇到了一些灰色区域。希望我能在这里找到我的答案并从中学习:)

所以我有一个假设是 10 个不同的 div。所有人都有相同的班级。每次我单击 div 时，它都必须添加另一个类（在本例中为 css 中的背景颜色）。为此，我有这个：

$(document).ready(function() {
$(".menucardmenu").click(function(){
        if($(this).hasClass("menucardmenu")) {
               $(this).addClass("backgroundmenucard");
    }
    else {
        alert ("condition false");
    }
  });
});

但现在的问题是，我怎样才能使只有一个 div 可以具有该背景颜色（在我的情况下为 backgroundmenucard）。取决于用户单击哪个 div，该 div 将具有背景颜色，并且前一个 div（被单击）应将其重置为正常。我可以这样做吗？：

$(this).removeClass("backgroundmenucard");

有谁知道这个问题的答案？？？

问候，安德鲁

【问题讨论】：

我认为“else”块永远不会执行......我错了吗？
@Sayem 不，你没有错。你甚至可以说你是对的;-)

标签： javascript jquery class if-statement

【解决方案1】：

尝试以下方法：

$(".menucardmenu").click(function(){
    $(".backgroundmenucard").removeClass("backgroundmenucard");
     $(this).addClass("backgroundmenucard");
  });

演示：http://jsfiddle.net/r2Sua/

（我删除了if，因为在这种情况下它没用）

【讨论】：

这正是我所需要的。非常感谢你。是的，我正在研究 if-else 语句，所以我将它用作基本语句。在那之后我不确定它的目的是什么，因为我已经工作了

【解决方案2】：

全部删除...

$(".menucardmenu").removeClass("backgroundmenucard");

然后添加到this

【讨论】：

【解决方案3】：

$(function() // shorthand for document ready
{
    var $divs = $('div.menucardmenu'), // standard jQuery "cache" idiom
        BG_CLASS = 'backgroundmenucard'; // stay DRY, less prone to typos

    $divs.live('click', function() // use .live to bind only 1 event listener
    {   
        // remove the class from all divs
        $divs.removeClass(BG_CLASS);

        // add the class to this div
        $(this).addClass(BG_CLASS);
    }
  });
});

if($(this).hasClass("menucardmenu")) 检查完全没有必要，因为您已经在选择具有该类的元素。它将始终评估为true。

【讨论】：

【解决方案4】：

$('.menucardmenu').click(function(){
 $('.menucardmenu').removeClass('backgroundmenucard');
 $(this).addClass('backgroundmenucard');
});

【讨论】：

【解决方案5】：

另一种选择是：

$(".menucardmenu").not(this).removeClass("backgroundmenucard");
$(this).addClass("backgroundmenucard");

这样你就不会删除类并将其添加到特定的 (this) 元素中

【讨论】：

无论如何，您都将课程添加到this，所以它真的没有什么区别。