Layui弹出层如何通过ESC键触发关闭回调-Layui教程-PHP中文网

Esc键默认不触发cancel回调，需在success中手动绑定keyup事件并显式调用cancel函数，再执行layer.close(index)，且须在end中解绑以避免内存泄漏。

ESC键默认不触发 cancel 回调

直接按 esc 关闭弹层时，cancel 回调不会自动执行——这是很多人踩坑的第一点。layui 的 cancel 只响应右上角关闭按钮或点击遮罩层（当 shadeclose: true 时），esc 是通过全局 keyup 监听后调用 layer.close(index) 实现的，它绕过了 cancel 的触发逻辑。

手动绑定 keyup 并显式调用 cancel

要让 Esc 行为和点击关闭按钮一致，必须在 success 回调里绑定事件，并在触发时手动调用 cancel 函数：

先保存传入的 cancel 回调引用（因为 layer.open 参数中它可能是匿名函数）
在 success 中监听 document 的 keyup，判断 e.which === 27
调用 cancel(index, layero)，再执行 layer.close(index)（或由 cancel 内部决定是否关闭）

示例：

var userCancel = function(index, layero) {
  console.log('用户取消操作');
  // 这里可做清理、还原状态等
};
layer.open({
  content: '确认删除？',
  yes: function(index) { layer.close(index); },
  cancel: userCancel,
  success: function(layero, index) {
    var $doc = $(document);
    var escHandler = function(e) {
      if (e.which === 27) {
        userCancel(index, layero);
        layer.close(index);
      }
    };
    $doc.on('keyup.esc-' + index, escHandler);
    // 注意：需在 end 回调里解绑，避免内存泄漏
  },
  end: function() {
    $(document).off('keyup.esc-' + layer.index);
  }
});