layui 开关switch

效果图：

html代码：

<input type="checkbox" name="switch" lay-skin="switch" lay-text="正常|关闭"
                                   lay-filter="switchTest"
                                   value="1">
                            <div class="layui-unselect layui-form-switch layui-form-onswitch" lay-skin="_switch">
                                <em>ON</em><i></i>
                            </div>

 

js代码：

<script>
// 状态监听开关
        layui.use(['form'], function () {
            var form = layui.form
                , layer = layui.layer
            //监听指定开关
            form.on('switch(switchTest)', function (data) {
                if (this.checked) {
                    layer.msg('开关checked：' + (this.checked ? 'true' : 'false'), {
                        offset: '6px'
                    });
                    layer.tips('温馨提示：请注意开关状态的文字可以随意定义，而不仅 仅是ON|OFF', data.othis)
                } else {
                    layer.msg('开关： 关掉了', {
                        offset: '6px'
                    });
                }
                //do some ajax opeartiopns;
            });
        });
</script>