Layui开关添加弹出确认框及layer.confirm的回调

最新推荐文章于 2026-05-08 21:41:44 发布

原创最新推荐文章于 2026-05-08 21:41:44 发布 · 7k 阅读

8 ·

本内容遵循CC 4.0 BY-SA版权协议

HTML前端同时被 2 个专栏收录

6 篇文章

订阅专栏

Layui

3 篇文章

订阅专栏

本文深入探讨了在前端开发中，如何使用confirm回调处理开关状态改变的确认操作。详细介绍了不同按钮触发的回调类型，以及如何通过包裹end和cancel在特定情况下触发相应事件。

一、confirm回调

在给开关添加确认框之前，先打印了confirm的几种回调，每次的顺序点击为确认按钮、取消按钮、右上角的X按钮。
第一种
1.写法
在这里插入图片描述
2.打印值

第二种

1.写法
在这里插入图片描述
2.打印值

可以看到点击确认和取消按钮都触发了end，点击X触发了一次end
要使用end或者cancel的回调，需要用大括号{}将end、cancel包裹

二、开关添加confirm

 //监听指定开关
            form.on('switch(switchState)', function (obj) {
                var thisobj= this;
                var ck = thisobj.checked;
                layer.confirm(ck ? '确定启用？' : '确认禁用？', {
                    btn1: function (index) {
						/**post*/
                        layer.close(index);
                    },
                    btn2: function () {
                        thisobj.checked = !ck;
                        form.render('checkbox');
                    },
                    cancel: function () {
                        thisobj.checked = !ck;
                        form.render('checkbox');
                    }
                })
            });