点击取消按钮或右上角×时,需拦截默认关闭并弹出“放弃编辑?”确认框:第一步在layer.open的cancel回调中return false;第二步调用layer.confirm并配置icon:3及按钮文本;第三步在confirm的yes和cancel回调中均执行layer.close(index);右上角×自动触发cancel回调,无需额外监听;confirm回调中需显式传入parentIndex确保正确关闭。

点击取消按钮时弹出二次确认对话框
用户在编辑表单后误点右上角 × 或“取消”按钮,需阻止直接关闭并弹出“放弃编辑?”确认框,避免数据丢失。
第一步:在 layer.open 的 cancel 回调开头立即 return false;【这是唯一能拦截默认关闭行为的时机】
第二步:紧接着调用 layer.confirm,传入提示语和配置对象,其中 icon 设为 3(问号),btn 设为 ['确定放弃', '再编辑一下'];
第三步:在 confirm 的 yes 回调里执行 layer.close(index),在 cancel 回调里也必须执行 layer.close(index);【漏掉任一回调中的 layer.close(index),弹窗将残留无法关闭】
右上角 × 点击后也触发相同确认逻辑
layer 的 closeBtn: 0 可隐藏 × 按钮,但业务需要保留它并统一管控——这正由 cancel 回调覆盖实现。右上角 × 触发的正是 cancel 回调,无需额外监听 DOM 事件。
方法一:直接复用上一节的 cancel 配置,无需改动;
方法二:若需区分 × 和“取消”按钮行为(极少见),可改用 layer.open + 自定义按钮 + 手动绑定 × 事件,但会绕过 cancel 机制,增加维护成本,不推荐。
确保 confirm 中 index 传递准确
layer.confirm 的 yes/cancel 回调函数参数中没有自动带入父层 index,必须显式传入:
layer.confirm('放弃编辑?', { icon: 3 }, function() { layer.close(parentIndex); }, function() { layer.close(parentIndex); });
注意:parentIndex 是 open 时返回的值,需在作用域内保持可访问;若在 iframe 子页中操作,且要关闭的是父页弹窗,则 parentIndex 应通过 parent.layer.getFrameIndex(window.name) 获取。


















