layui的应用广泛相比就不需要多加说了，本文就该框架中的switch的使用做详细说明。

Gitee地址：https://gitee.com/layui/layui?_from=gitee_search

switch样式如图：

html代码：

<input data-id="1" lay-filter="switchDefault" type="checkbox" name="xxx"  lay-skin="switch">
<input  data-id="1"  lay-filter="switchDefault" type="checkbox" name="yyy" lay-skin="switch" lay-text="ON|OFF" checked>
<input  data-id="1" lay-filter="switchDefault"  type="checkbox" name="zzz" lay-skin="switch" lay-text="开启|关闭">
<input  data-id="1" lay-filter="switchDefault"  type="checkbox" name="aaa" lay-skin="switch" disabled>

checked：即switch选中操作

disabled：即switch禁止操作，默认未灰色样式

js操作代码及参数的传递：

<script>
layui.use('form', function(){
  var form = layui.form;
  //switchDefault  即 lay-filter="switchDefault"中的参数
  form.on('switch(switchDefault)', function(data){
    console.log(data.elem); //得到checkbox原始DOM对象
    console.log(data.elem.checked); //开关是否开启，true或者false
    console.log(data.value); //开关value值，也可以通过data.elem.value得到
    console.log(data.othis); //得到美化后的DOM对象
	//获取data-id  基于jq
	console.log($(data.elem).attr("data-id"));
  });
});
</script>

以上便是关于layui中switc的基础使用方法。