layer.tips 的 time 参数不生效是设计使然,其消失由 mouseout 和 click 事件驱动,不支持时间控制;需改用 layer.open({type: 1}) 或 layer.msg({time: -1, skin: 'layui-layer-tips'}) 实现常驻提示。
layer.tips 的 time 参数不生效?这是设计使然
layer.tips() 的 time 参数在官方文档和实际运行中完全被忽略,无论你传 time: -1、time: 0 还是 time: 999999,tips 层都会在鼠标移出目标元素或点击页面任意位置后立即消失。这不是 bug,而是该类型弹层的固有行为:它本质是「提示性浮层」,依赖用户交互焦点存在,不支持纯时间维度的持久化。
想让 tips 永久显示?得换 type 或手动接管
真正能“永久显示”的,只有 type: 1(页面层)或 type: 2(iframe 层)这类可自主控制生命周期的弹层。如果你坚持用 tips 视觉风格但要常驻:
- 不要用
layer.tips(),改用layer.open({ type: 1, ... }) - 手动设置
closeBtn: false、shadeClose: false、cancel: null - 用
offset和area模拟 tips 的定位与尺寸,例如offset: ['20px', '100px'] - 若需箭头效果,得自己用 CSS 伪元素画一个,
layer.tips的小三角是绑定在自动销毁逻辑里的,拆不开
为什么不能直接 hack layer.tips 的定时器?
因为 layer.tips 内部没有基于 setTimeout 的关闭逻辑,它的消失由两个 DOM 事件驱动:mouseout(目标元素)和 click(document)。即使你通过 layer.close(index) 强制关掉再重开,也会破坏定位锚点、触发重绘抖动,且无法阻止用户点击遮罩或空白处——而 tips 默认不提供 shade: 0 或 shadeClose: false 配置项。
最简替代方案:用 msg + 自定义样式模拟 tips 外观
如果你只是想要一个带小箭头、贴着元素的常驻提示,又不想写太多 CSS:
- 调用
layer.msg('内容', { time: -1, offset: 't', skin: 'layui-layer-tips' }) - 注意:
skin: 'layui-layer-tips'会启用内置 tips 样式(含浅黄底色+灰色边框+小三角) -
offset: 't'让它出现在目标上方,配合style微调位置,例如style: 'margin-top: -10px;' - 它仍是
msg类型,所以time: -1有效,且支持closeBtn: true和手动layer.close()
真正容易被忽略的是:Layui 的「类型」和「行为」强绑定,想绕过某类弹层的默认交互逻辑,不是调参能解决的,得选对 type。











