Question

我有一个带有班级名称的div：.sel-display-on。单击时，我想用jquery将其更改为.sel-display-off。这有可能吗？是否会应用这个新类名的css属性？

$('.sel-display-on').click(function (e) {
        e.stopPropagation();
        // change class name to .sel-display-off
});

Answer 1

$(this).removeClass('sel-display-on').addClass('sel-display-off');

或者，如果你确定这个元素没有任何其他类名（不是很好的练习，但可能更快）：

$(this).attr('class', 'sel-display-off');

Answer 2

$(this).addClass('...');

或

$(this).attr('class','...');

Answer 3

您可以这样做：

$('.sel-display-on').click(function (e) {
    e.stopPropagation();
    // change class name to .sel-display-off
    $(this).removeClass('sel-display-on').addClass('sel-display-off');
});

您也可以使用toggleClass执行此操作：

$('.sel-display-on').click(function (e) {
    e.stopPropagation();
    // change class name to .sel-display-off
    $(this).toggleClass(function(){
       if($(this).is('.sel-display-on'){ 
          return "sel-display-off";
       } else {
          return "sel-display-on";
       }
});

Answer 4

你所有问题的答案都是“是”

您可以根据需要使用addClass，removeClass，toggleClass和attr('class', ...)。

如果这是e.stopPropagation上的div，则不需要{{1}}，除非您要停止其绑定的其他功能。

Answer 5

http://api.jquery.com/addClass/

http://api.jquery.com/removeClass/

是的，使用上面的两个函数来实现这一目的。此外，新课程将立即应用。

另一个注意事项：删除.sel-display-on类后，您将无法再使用.sel-display-on选择该元素。

在jquery中单击时更改类名的名称

5 个答案: