如果条件为true,如何将类添加到jQuery元素,如果条件为false,则删除相同的类?

时间:2014-04-07 23:35:53

标签: javascript jquery

是否有更短的方法来执行以下操作?

var select_all_checkbox = $("input.select_all");
var is_checked = select_all_checkbox.prop("checked");

if (is_checked) {
    select_all_checkbox.parent().addClass("selected");
} else {
    select_all_checkbox.parent().removeClass("selected");
}

2 个答案:

答案 0 :(得分:28)

使用toggleClass,传递第二个参数(布尔值),指定是否应该添加类:

select_all_checkbox.parent().toggleClass("selected", is_checked);

如果input.select_all选择了多个元素,则必须迭代它们:

$("input.select_all").each(function() {
    $(this).parent().toggleClass('selected', this.checked);
});

答案 1 :(得分:3)

绝对!您可以以编程方式在方法(addClass / removeClass)之间进行选择,并使用执行表达式时返回的方法。

像这样:

var select_all_checkbox = $("input.select_all");
var is_checked = select_all_checkbox.prop("checked");

select_all_checkbox.parent()[is_checked ? "addClass" : "removeClass"]("selected");