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 滑块 →