jQuery UI datepicker - 如果使用 $('').datepicker('option', )，则加载时输入无效

Posted 2023-03-12

【中文标题】jQuery UI datepicker - 如果使用 $(\'\').datepicker(\'option\', )，则加载时输入无效

【英文标题】：jQuery UI datepicker - input invalid on load if using $('').datepicker('option', )jQuery UI datepicker - 如果使用 $('').datepicker('option', )，则加载时输入无效

【发布时间】：2015-11-05 12:56:49

【问题描述】：

我有以下简单的形式：

<form>
    <input name="default" type="date" required="required" /><br />
    <input name="maxDate" type="date" required="required" />
</form>

如果我像这样初始化 jQuery UI Datepicker 插件：

$('input[type=date]').datepicker(
    dateFormat: "yy-mm-dd"
);
$('input[name="maxDate"]').datepicker('option', 
    maxDate: 0
);

带有扩展选项的第二个输入将在页面加载时无效（请参阅附件JSfiddle），直到我打开其中的日期选择器并设置一些值。

我检查了Datepicker Widget API，但它看起来是为所选日期选择器实例提供额外选项的有效方法。我做错了吗？

提前谢谢你:)

---

编辑：附上截图 (FF 41)

【问题讨论】：

jsfiddle 有什么问题，好像工作正常？

maxDate: 0 在第二个字段上也可以正常工作。

您应该将输入类型从日期更改为文本或使用 Modernizr 或类似库来检测浏览器是否支持输入类型=日期，如果不支持则加载 jQuery UI 日期选择器。也许您会感到困惑，在某些浏览器中 html5 datepicker 在另一个上，而您看不到它。

@DeepakBiswal 在 Firefox 中查看；您的浏览器中的第二个输入不是红色的吗？ （见截图）

@calinaadi：是的，input type=text 也是如此。

【参考方案1】：

你可以调用destroy然后重新初始化想要的日期选择器：

$('input[name="maxDate"]').datepicker("destroy"); $('input[name="maxDate"]').datepicker(maxDate: 0,dateFormat: "yy-mm-dd");

喜欢这里：Change option dynamically in JQuery UI DatePicker fails

【讨论】：

谢谢。最后，我根据您的回答编写了以下函数：$.fn.customizeDatepicker = function(newOptions) var globalOptions = $(this).datepicker('option', 'all'); $(this).datepicker('destroy').datepicker($.extend(globalOptions, newOptions)); return this; ;