layui.form.verify 失败时的 tips 显示时长由 layer.tips 的 time 参数控制,默认硬编码为 3000 毫秒且不可通过配置或 CSS 修改;需在自定义验证规则中手动调用 layer.tips 并传入自定义 time 值,同时配合 layer.closeAll('tips') 避免旧实例干扰。
layui.form.verify 失败时的 tips 显示时长由什么控制
默认是 3 秒,但这个时长**无法通过配置项或 css 修改**。layui 在内部调用 layer.tips 时硬编码了 time: 3000,且不暴露参数入口。你改 layer.config({time: 5000}) 或覆盖 .layui-layer-tips 的动画 duration 都无效——因为内联样式和函数调用优先级更高。
想改时长必须绕过默认提示逻辑
核心思路:不让 layui 自动触发 layer.tips,自己手动调用并传入 time 参数。
- 在自定义验证规则中,不要 return 字符串(否则触发内置 3 秒提示)
- 改为
if (!value) { layer.tips('不能为空', item, {tips: [1, '#e74c3c'], time: 5000}); return false; } -
item是当前 DOM 元素,必须传入才能准确定位;time: 5000表示 5 秒后自动消失 - 注意:如果用了
lay-submit,它会跳过你的规则直接走内置校验——得换成普通按钮 +form.on('submit()')手动控制
form.on('submit') 中统一控制所有字段的提示时长
适合多字段、多规则场景,避免每个 form.verify 规则里重复写 layer.tips。
- 表单按钮去掉
lay-submit,设为type="button" - 在
form.on('submit()', function(data){...})里调用form.validate()(需确保已引入该方法,Layui 2.8+ 原生支持) -
form.validate()返回false时,遍历data.field对应的元素,按字段名匹配你预设的规则函数,手动执行并调用layer.tips(..., {time: 4000}) - 这样所有错误提示都走同一套逻辑,时长、颜色、方向完全可控
容易被忽略的关键点
很多人试了 layer.tips('xxx', elem, {time: 6000}) 却发现还是 3 秒消失——问题往往出在:没清掉 layui 内部残留的旧 tips 实例。Layui 在验证失败后可能已创建了一个未关闭的 tips,新调用会被它干扰。稳妥做法是在每次提示前加一句 layer.closeAll('tips'),或者用变量存住上一个 tips 索引,调 layer.close(tipsIndex) 再新建。


















