layui switch 開關監聽 彈出確定狀態轉換
阿新 • • 發佈：2018-12-12
參考文章地址：https://www.cnblogs.com/yysbolg/p/9139631.html 下面他的程式碼和用在我的框架下的程式碼例項： <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <link rel="stylesheet" href="static/layui/css/layui.css"> </head> <body> <form class="layui-form" action=""> <div class="layui-form-item"> <div class="layui-input-block"> <input type="checkbox" name="zzz" lay-skin="switch" lay-filter="switchTest" lay-text="開啟|關閉"> </div> </div> </form> <script src="static/layui/layui.js"></script> <script> //Demo layui.use(['form','jquery','layer'], function () { var form = layui.form; var jquery = layui.jquery; var layer = layui.layer; //監聽提交 form.on('switch(switchTest)', 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物件 var x=data.elem.checked; layer.open({ content: 'test' ,btn: ['確定', '取消'] ,yes: function(index, layero){ data.elem.checked=x; form.render(); layer.close(index); //按鈕【按鈕一】的回撥 } ,btn2: function(index, layero){ //按鈕【按鈕二】的回撥 data.elem.checked=!x; form.render(); layer.close(index); //return false 開啟該程式碼可禁止點選該按鈕關閉 } ,cancel: function(){ //右上角關閉回撥 data.elem.checked=!x; form.render(); //return false 開啟該程式碼可禁止點選該按鈕關閉 } }); return false; }); }); </script> </body> </html>
例項：
