jQuery | removeClass() 与示例

removeClass() 是 jQuery 中的一个方法，可以从元素中删除指定的 CSS 类。

语法

$(selector).removeClass(classname,function(index,currentclass));

• selector：必需，用于匹配需要删除 CSS 类的元素。
• classname：可选，需要删除的 CSS 类名，可以是多个类名以空格分隔。
• function(index,currentclass)：可选，当该方法被调用时，执行的函数。

示例

删除单个类名

下面的示例将删除按钮元素中的 disabled CSS 类名：

<button id="myButton" class="btn btn-success disabled">Click Me</button>

$('#myButton').removeClass('disabled');

在上述示例中，disabled 类名将被删除，因此按钮将变为可点击状态。

删除多个类名

下面的示例将删除按钮元素中的 btn-success 和 disabled CSS 类名：

<button id="myButton" class="btn btn-success disabled">Click Me</button>

$('#myButton').removeClass('btn-success disabled');

在上述示例中，btn-success 和 disabled 类名将被删除，因此按钮将变为默认状态。

在函数中使用 removeClass

下面的示例将在点击按钮时，通过自定义函数从元素中删除 red 类名：

<button id="myButton" class="btn red">Click Me</button>

$('#myButton').click(function() {
  $(this).removeClass('red', function(index, currentclass) {
    console.log(currentclass); // output: "btn red"
  });
});

在上述示例中，当用户点击按钮时，red 类名将被删除，并在控制台中输出当前元素的所有类名。

总结

removeClass() 是一个非常方便的方法，可以快速地从元素中删除指定的 CSS 类。它支持单个和多个类名的删除，并支持在函数中使用，使其更加灵活和动态。