应在layer.open时保存弹层index,通过自定义关闭函数触发日志上报后再调用layer.close(index);可封装logClose方法或重绘标题栏拦截右上角关闭事件。

要在Layui弹出层关闭时自动记录日志,不能直接覆盖全局layer.close函数,否则会影响所有弹层的正常关闭逻辑;必须在具体打开弹层时,通过回调或封装方式注入日志行为。
修改单个弹层的关闭逻辑(推荐)
第一步:调用layer.open时,不使用默认的右上角×或layer.close()裸调,而是统一通过自定义关闭函数触发。
第二步:在open配置中设置btn或yes等回调,或监听layer.ready后手动绑定关闭按钮事件。例如打开一个信息框时,在content里写一个带data-action="close-with-log"的按钮,然后用jQuery绑定点击事件。
第三步:在点击事件中先执行日志上报(如console.log或发送AJAX),再调用layer.close(index)。注意必须传入正确的弹层index,否则会关闭错层或报错。
这一步最关键:每次调用layer.open都会返回一个index值,【必须把该index保存到闭包或data属性中,后续关闭时才能准确传入】。
封装自己的layer.logClose方法
方法一:在项目入口JS中定义全局辅助函数:
window.layer.logClose = function(index, logMsg = 'layer closed') { console.info(`[Layui Log] ${logMsg}`, { index, time: new Date().toISOString() }); layer.close(index); };
方法二:在打开弹层时直接内联调用:
const index = layer.open({ type: 1, content: '' });
注意:这里onclick里的index必须是变量值,不能写死为字符串'index',否则会报未定义错误。
拦截右上角关闭按钮(需重绘标题栏)
layer.open时设置title: false,自行构造含关闭按钮的HTML标题,并在其中绑定带日志的关闭逻辑。
例如content设为'
然后定义handleCloseWithLog = (idx) => { console.log('用户点击右上角关闭', idx); layer.close(idx); };
这一步绕过了Layui原生标题栏,但完全可控——【原生右上角×无法被JS事件拦截,只能替换掉】。


















