如何取消jQuery DatePicker输入框默认显示的今日日期

1. 这个DatePicker是否来自jquery-rails gem？ #

大概率是，或者至少是基于jquery-rails和jquery-ui-rails构建的。原因有两点：

• jquery-rails是Rails项目中引入jQuery的标准gem，而jQuery UI的DatePicker是最常用的日期选择组件，很多Rails项目会搭配jquery-ui-rails来使用它。
• 你HTML里的data-date-with-hiddens属性和拆分的年/月/日隐藏字段，是Rails生态中常见的日期选择器封装模式——把一个可视化的文本框和三个用于提交的隐藏字段绑定，这种实现通常是基于jQuery UI DatePicker做的扩展，在Rails项目里很常见。

2. 为什么DOM无值但输入框显示今日日期？ #

这是jQuery UI DatePicker（以及基于它的封装）的默认行为导致的：

• 当DatePicker初始化时，如果绑定的文本框没有预设值（你的DOM里#pick_some_deadline_at的value是空的），组件会自动将当前日期作为默认显示值渲染到输入框中，但这个值并不会同步到文本框的DOM value属性里——因为组件认为这只是一个“占位提示”，而非用户主动选择的日期。
• 同时，你的实现里绑定了三个隐藏字段（年/月/日），这些字段的value也为空，说明DatePicker默认不会自动填充这些提交用的字段，只有当用户主动选择日期时，才会同步更新文本框的显示和隐藏字段的值。

工作原理简化说明 #

这个带隐藏字段的DatePicker流程大概是这样：

1. 页面加载时，JS初始化DatePicker，绑定到#pick_some_deadline_at文本框，同时关联三个隐藏字段。
2. 初始化检测到文本框无值，自动渲染今日日期到输入框显示层，但不修改DOM的value属性和隐藏字段。
3. 用户选择日期后，组件将选择的日期格式化为文本显示在输入框，同时拆分年/月/日填充到对应的隐藏字段中，方便表单提交。
4. 表单提交时，实际提交的是三个隐藏字段的值，而非文本框的显示值。

如何取消默认显示的今日日期？ #

你需要修改DatePicker的初始化配置，禁用默认日期的自动渲染：

方法1：修改初始化配置 #

找到初始化这个DatePicker的JavaScript代码（通常在application.js或者对应的页面JS文件里），添加defaultDate: null配置项：

$("#pick_some_deadline_at").datepicker({
  defaultDate: null,
  // 其他已有的配置项...
});

defaultDate: null会告诉组件：初始化时不要设置任何默认日期，让输入框保持空白。

方法2：初始化后清空显示 #

如果找不到初始化代码（比如是Rails表单助手自动生成的），可以在页面加载完成后手动清空DatePicker的显示：

$(document).ready(function() {
  $("#pick_some_deadline_at").datepicker("setDate", null);
});

方法3：修改Rails表单配置（如果是助手生成的） #

如果这个日期选择器是用Rails的表单助手生成的（比如date_field或者自定义的助手），可以在生成时指定include_default: false或者类似的选项，阻止默认日期的渲染。

内容的提问来源于stack exchange，提问作者AlbertMunichMar