jQuery Date Picker功能增强求助：图标触发与重置事件问题

问题1：修复日期图标无法唤起日历的问题 #

• 核心原因：日期图标未绑定唤起日历的触发逻辑，只有输入框本身带有datepicker默认的点击唤起事件
• 解决步骤：
  1. 确保你的日期图标有可识别的选择器（比如类名date-icon），HTML结构示例：

     <input type="text" id="historicDate">
     <i class="date-icon"></i>
     

  2. 在datepicker初始化完成后，给图标绑定点击事件，手动唤起日历：

     $('.date-icon').on('click', function() {
       $('#historicDate').datepicker('show');
     });
     

  3. 重要提醒：viewHistoricFund函数只需要在页面加载时执行一次，不要在重置按钮或其他重复触发的逻辑中调用，否则会重复初始化datepicker引发异常。

问题2：重置按钮触发日期变更关联函数 #

• 核心原因：datepicker("setDate")仅负责设置日期值，不会自动触发onSelect回调；原代码中的trigger("click")和viewHistoricFund()都是无效且多余的操作

• 解决方法（二选一即可）：
  方法一：直接手动调用关联函数

  $("#clear-historic-date-button").click(function (e) {
    const today = new Date();
    // 按datepicker指定的格式格式化今日日期
    const formattedToday = $.datepicker.formatDate("dd MM yy", today);
    
    $("#historicDate").datepicker("setDate", today);
    // 直接触发业务逻辑函数
    showHistoricDate(formattedToday);
  });
  

  方法二：复用datepicker的onSelect回调逻辑

  $("#clear-historic-date-button").click(function (e) {
    const today = new Date();
    $("#historicDate").datepicker("setDate", today);
    
    // 获取并执行datepicker的onSelect回调
    const onSelectCallback = $('#historicDate').datepicker('option', 'onSelect');
    if (onSelectCallback) {
      const formattedDate = $.datepicker.formatDate("dd MM yy", today);
      onSelectCallback(formattedDate, { type: 'manualSet' });
    }
  });
  

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