laydate range 模式下 value 字符串必须严格为“yyyy-mm-dd hh:mm:ss - yyyy-mm-dd hh:mm:ss”格式:两端含时分秒、中间为“空格-空格”、type 设为 'datetime',否则静默留空。
必须显式传 value 字符串,且两端时间都合法、分隔符严格为“空格-空格”,否则 laydate 会静默忽略——不是报错,而是输入框留空。
range 模式下 value 字符串格式必须精确匹配 format
比如 format: 'yyyy-MM-dd HH:mm:ss',那 value 就得是 "2026-04-24 00:00:00 - 2026-04-24 23:59:59" 这种结构:
- 中间三个字符必须是
(空格)、-(半角短横)、(空格),不能是中文“至”、全角破折号、连字符-(无空格)或波浪线~ - 两端时间都得含时分秒,哪怕你只想要日期范围,只要
format里写了HH:mm:ss,就得补上,否则被判定为非法 -
type必须设为'datetime';设成'date'会导致时间部分被丢弃,'time'则根本无法解析日期
动态生成今日起止时间推荐用 toISOString()
手动拼字符串容易因时区出错(比如东八区凌晨生成 UTC 时间变成前一天),toISOString() 是最稳的方案:
<pre class="brush:php;toolbar:false;">const now = new Date();
const start = new Date(now.getFullYear(), now.getMonth(), now.getDate(), 0, 0, 0);
const end = new Date(now.getFullYear(), now.getMonth(), now.getDate(), 23, 59, 59);
const valueStr = `${start.toISOString().slice(0, 19).replace('T', ' ')} - ${end.toISOString().slice(0, 19).replace('T', ' ')}`;
laydate.render({
elem: '#range',
type: 'datetime',
format: 'yyyy-MM-dd HH:mm:ss',
value: valueStr
});
- 不用
setHours(0,0,0),避免夏令时或跨天异常 - 不依赖
new Date().toJSON().slice(0,10),它在某些时区下可能比本地时间少 8 小时 - 如果项目已引入
dayjs,可用dayjs().startOf('day').format('YYYY-MM-DD HH:mm:ss')替代,更简洁
value 和 min/max 冲突时会静默失效
设了 min: '2026-04-20',但 value 是 '2026-04-19 00:00:00 - 2026-04-19 23:59:59'?laydate 不会警告,输入框直接为空。
-
min/max只约束可选范围,不影响value的合法性校验逻辑 - 若同时用
min/max,务必确保value落在区间内,否则默认值不出现 - 动态联动场景(如开始时间变了,结束时间 min 要更新),不能直接改配置对象,得调
ins.setOptions({ min: 'xxx' })并重 render
分开绑定两个 input 时 range 数组必须配对正确
UI 要求“开始”“结束”两个独立输入框,中间带“至”字,就不能用 range: true,得走数组模式:
- 父容器必须存在且是块级元素(如
<div class="layui-inline">),否则 laydate 找不到目标<li> <code>range: ['#start', '#end']里两个选择器必须真实存在,且 DOM 已挂载完成 - 别漏掉
form.render()(如果用了 layui.form),否则表单验证可能不识别新值 - 分隔符不能写进
range数组里,那是range: '至'的用法,和数组模式互斥
最常被忽略的是:value 格式错误不会抛错,只会沉默;而 min/max 与 value 的边界冲突也完全静默。调试时盯着输入框是否填值,比看控制台更有用。











