如何清除/重置jQuery DateRangePicker日历的已选日期？

你当前的重置代码仅清空了输入框的显示值，但插件内部的日期状态并未同步重置，导致再次打开日历仍会显示之前选中的日期范围。正确的做法是调用插件官方提供的API来完成完整重置，具体修改如下：

修改重置按钮的处理代码 #

/* Reset Calendar */
$('.reset').click(function () { 
    // 获取DateRangePicker实例
    const datePicker = $('.calendar__input').data('daterangepicker');
    // 重置插件内部的开始和结束日期状态
    datePicker.setStartDate(null);
    datePicker.setEndDate(null);
    // 清空输入框的显示值
    $('.calendar__input').val('');
    // 刷新日历视图，确保界面状态同步更新
    datePicker.updateView();
});

关键说明 #

• setStartDate(null) 和 setEndDate(null)：这两个是插件官方API，用于直接修改内部存储的选中日期状态，传入null即可清除已选值。
• 仅通过val('')清空输入框只会改变表面显示，插件内部的日期变量仍保留旧值，必须配合API调用才能完成彻底重置。

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