jQuery toggleClass() 方法
实例
在添加和删除所有 <p> 元素的 "main" 类名之间切换:
<!DOCTYPE html><html><head><script src="https://libs.baidu.com/jquery/2.1.4/jquery.min.js"></script><script>$(document).ready(function(){$("button").click(function(){$("p").toggleClass("main");});});</script><style>.main {font-size: 120%;color: red;}</style></head><body><button>切换 p 元素的 "main" 类</button><p>这是一个段落</p><p>这是另一个段落</p><p><b>注意:</b> 多次单击该按钮可查看切换效果</p></body></html>
定义与用法
toggleClass() 方法在添加和删除选定元素中的一个或多个样式类名之间切换。
此方法检查每个元素的指定样式类名。如果缺少类名,则添加类名,如果已经设置,则删除类名——这会产生切换效果。
但是,通过使用 "switch" 参数,可以指定仅删除或仅添加类名。
语法
$(selector).toggleClass(classname,function(index,currentclass),switch)
| 参数 | 描述 |
|---|---|
| classname | 必填。指定要添加或删除的一个或多个样式类名。要指定多个类,请用空格分隔类名 |
| function(index,currentclass) | 可选。指定返回一个或多个要添加/删除的类名的函数
|
| switch | 可选。一个布尔值,指定是添加类(true),还是删除类(false) |