如何在jQuery datepicker的选中结果中添加自定义时间字符串

• 监听日期选择器的changeDate事件：用户选中日期后会自动触发该事件，此时处理拼接逻辑不会和日期选择器的默认赋值逻辑冲突
• 获取格式化后的选中日期：通过事件回调自带的参数可以直接拿到符合你预设格式（dd/mm/yyyy）的日期字符串，不需要自己额外做日期格式化
• 拼接预设时间回填输入框：将日期字符串和你提前定义的time变量拼接后，赋值给输入框即可完成需求

HTML代码 #

<div class="wrapper">
  <label>
    <input type="text" class="dateselect" required="required"/>
    <span>Date</span>
  </label>  
</div>

JS代码 #

var time = "1:30PM";

$('.dateselect').datepicker({
    format: 'dd/mm/yyyy',
    startDate: new Date(),
    autoclose: true,
    closeOnSelect: true
}).on('changeDate', function(e) {
    // 拿到格式化后的选中日期
    const selectedDate = $(this).datepicker('getFormattedDate');
    // 拼接时间后回填
    $(this).val(`${selectedDate} ${time}`);
});

如果你使用的不是Bootstrap Datepicker，核心逻辑完全通用，只需要替换成对应日期选择器的「选中事件监听」「获取选中日期」API即可。

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