Switch 开关
表示两种相互对立的状态间的切换,多用于触发「开/关」。
基础用法
▼显示代码
文字描述
▼显示代码
禁用状态
▼显示代码
方法调用
▼显示代码
参数
你可以通过修改$.fn.switch.defaults来修改全局默认配置,也可以在初始化时传入指定配置$(el).switch({xx: xx})。
| 参数 | 说明 | 类型 | 可选值 | 默认值 |
|---|---|---|---|---|
| disabled | 是否禁用开关 | boolean | - | false |
| on | 开关是否开启 | boolean | - | false |
| width | 开关宽度(单位px) | number | - | 40 |
| activeHtml | 开关右边文本(开状态),支持html | string | - | '' |
| inactiveHtml | 开关左边文本(关状态),支持html | string | - | '' |
| activeValue | 开状态的值(由get方法获取) | - | - | true |
| inactiveValue | 关状态的值(由get方法获取) | - | - | false |
| activeColor | 开状态的背景色 | string | - | - |
| inactiveColor | 关状态的背景色 | string | - | - |
| name | 开关内置checkbox的name属性 | string | - | - |
| onchange | 开关变化时触发的事件(set方法不会触发) | function | - | - |
方法
你可以通过调用$(el).switch('xxx')来调用开关方法。
| 方法 | 说明 | 举例 |
|---|---|---|
| disabled | 禁用开关 | $(el).switch('disabled') |
| show | 取消禁用状态 | $(el).switch('show') |
| set | 设置开关选中状态(不会触发 change 事件) | $(el).switch('set', true / false) |
| get | 获取开关值(activeValue/inactiveValue) | $(el).switch('get') |
← Select 选择器 Slider 滑块 →