English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية

jQuery toggleClass() 方法

HTML de jQuery/Métodos CSS

toggleClass()方法对添加和删除所选元素中的一个或多个类名称之间切换。

此方法检查每个元素的指定类名称:

  • 如果缺少类名,则添加

  • 如果已经设置了类名,则将其删除

但是,通过使用estado参数,您可以指定仅删除或仅添加类名称。

语法:

切换类名:

$(selector).toggleClass(className)

Usoestado参数切换类:

$(selector).toggleClass(className, state)

使用函数切换类:

$(selector).toggleClass(function(index, currentClass), state)

实例

Cambiar entre agregar y eliminar el nombre de clase "anotherClass" en todos los elementos <p>

$("button").click(function(){
  $("p").toggleClass("anotherClass");
});
Prueba para ver‹/›

UsoestadoParámetros para agregar o eliminar nombres de clase solo:

$("button").click(function(){
  $("p").toggleClass("anotherClass", true);
});
Prueba para ver‹/›

Valor del parámetro

ParámetrosDescripción
classNameClase(s) a agregar/Clase(s) eliminada(s) (separadas por espacio)
estadoUn valor booleano que determina si se debe agregar (true) o eliminar la clase (false)
function(index, currentClass)Función, que devuelve uno o más (separados por espacio) nombres de clase, que se agregarán a los nombres de clase existentes o se eliminarán de los nombres de clase existentes.
  • index-Devuelve la posición del elemento en la colección

  • currentClass-Devuelve el nombre de la clase actual del elemento seleccionado

HTML de jQuery/Métodos CSS