You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

bootstrap datepicker设当前日期报Cannot read 'minDate' of undefined错误

错误产生原因

报错核心是混用了Bootstrap Datepicker和jQuery UI Datepicker的API,两者的调用逻辑、配置项命名完全不兼容,具体触发原因如下:

  • 初始化时你使用的是Bootstrap Datepicker的别名实例化方法bootstrapDP(),但后续赋值时调用了jQuery UI Datepicker的datepicker("setDate")方法,jQuery UI的datepicker实例从未被初始化过,自然找不到配置的minDate属性,触发读取undefined属性的报错。
  • 额外配置错误:Bootstrap Datepicker限制日期范围的原生参数是startDate和endDate,你写的minDate、maxDate是jQuery UI Datepicker的参数,就算调用方法正确,配置的日期限制规则也不会生效。
解决方案

统一使用Bootstrap Datepicker的API完成初始化和赋值操作即可,步骤如下:

  1. 修正初始化配置,替换为Bootstrap Datepicker支持的参数:
$('#ExpectedCloseDate').bootstrapDP({
    format: 'dd/mm/yyyy',
    autoclose: true,
    startDate: "0", // 等效原minDate,代表当天及以后可选
    endDate: "+30d", // 等效原maxDate,代表最远可选30天后
});
  1. 调用Bootstrap Datepicker的对应方法设置当前日期,不要调用jQuery UI的datepicker方法:
// 方案1:直接通过bootstrapDP实例调用setDate方法
$("#ExpectedCloseDate").bootstrapDP("setDate", new Date());
// 方案2:先给输入框赋值再触发组件更新,兼容性更强
$("#ExpectedCloseDate").val(new Date().toLocaleDateString('en-GB')).bootstrapDP('update');

补充注意:你的项目中用bootstrapDP作为实例化别名,本质是为了避免Bootstrap Datepicker和jQuery UI Datepicker的datepicker方法名冲突,所有对该日期组件的操作都要统一用bootstrapDP调用,避免触发jQuery UI的逻辑。

内容的提问来源于stack exchange,提问作者BFilip

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.10.01 16:36:05