SwitchButton(开关按钮)

用于$.fn.switchbutton.defaults重写默认值对象。(该组件自1.4.3版开始可用)

用在"form"表单中的开关按钮。按钮有2个状态:“开”和“关”,用户可以点击或轻敲来切换,标签状态是可定制的。

用法

通过标签创建开关按钮。

  1.  <input class="easyui-switchbutton" checked>
  2.  <input class="easyui-switchbutton" data-options="onText:'Yes',offText:'No'">

使用Javascript创建开关按钮。

  1. <a href="javascript:void(0)" id="sb" onclick="javascript:alert('ok')>Ok</a>  
  2. <div id="mm" style="width:100px;">  
  3. ...   
  4. </div>  
 

属性

属性名 属性值类型 描述 默认值
width number 开关按钮宽度。 60
height number 开关按钮高度。 26
handleWidth number 开关把手宽度。 auto
checked boolean 定义按钮是否开启。 false
disabled boolean 定义按钮是否禁用。 false
readonly boolean 定义按钮是否只读。 false
reversed boolean 设置为true时,反转开关文本。 false
onText string 左边文本值(反转后是右边)。 ON
offText string 右边文本值(反转后是左边)。 OFF
handleText string 开关把手文本值。 ''
value string 给按钮绑定默认值。 on

事件

事件名 事件参数 描述
onChange checked 在更改控件值的时候触发。

方法

方法名 方法参数 描述
options none 返回属性对象。
resize param 调整开关按钮大小。
disable none

禁用开关按钮。

代码示例: 

$('#sb').switchbutton('disable');
enable none

启用开关按钮。

代码示例: 

$('#sb').switchbutton('enable');
readonly mode 启用/禁用只读模式。
check none 启用开关按钮。
uncheck none 禁用开关按钮。
clear none 清除开关按钮的值。
reset none 重置开关按钮的值。
setValue value 设置开关按钮的值。

关注编程学问公众号