layui switch 开关监听 弹出确定状态转换的例子
2019-09-21 09:18
1701 查看
不废话,直接上图:
原始状态:
点击确定:
点击取消或者X
代码:
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <link rel="stylesheet" href="static/layui/css/layui.css" rel="external nofollow" > </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>
以上这篇layui switch 开关监听 弹出确定状态转换的例子就是小编分享给大家的全部内容了,希望能给大家一个参考
您可能感兴趣的文章:
相关文章推荐
- Adroid 广播 有序和无序及短信接收和监听手机通话状态小例子
- Android 监听WiFi的开关状态实现代码
- iOS:使用代理模式监听开关状态改变事件
- android 自定义View在弹出的软键盘之上,以及测量软键盘高度和监听软键盘状态
- Android打开WLAN开关的广播状态监听
- 虾扯蓝牙(一)获取蓝牙当前状态,监听蓝牙手动开关,代码开关蓝牙
- Android 监听 WiFi 开关状态
- Android键盘处理-监听键盘状态并实现QQ拉出式弹出回复框。
- android屏幕监听,手机是否处于锁屏状态,在锁屏之上弹出Toast.makeText消息
- android 监听键盘弹出收起状态
- android 自定义View在弹出的软键盘之上,以及测量软键盘高度和监听软键盘状态
- 2、弹出确定框例子
- 在后置代码中弹出确定取消对话框的例子
- HTML5判断设备在线离线及监听网络状态变化例子
- 服务器端按钮弹出确定取消对话框的例子
- android 监听判断软键盘的弹出、隐藏状态
- Android 监听软键盘弹出状态
- 监听全局键盘的弹出与隐藏状态
- HTML5外包团队——技术分享:HTML5判断设备在线离线及监听网络状态变化例子
- DataGrid中全选删除按钮,如果没选,先提示没有选择,再弹出确定删除对话框的例子