jQuery使用remove()仅跳过select的option未删除，点击span移除早于当前时间的选项失效

问题原因排查 #

• 1. 分钟数计算逻辑错误：原代码仅获取当前小时数换算分钟，没有叠加当前分钟值，导致判断阈值完全不准确，比如当前时间为14:25时，正确总分钟数应为14*60+25=865，原代码只计算为14*60=840。
• 2. 事件绑定失效：flatpickr的日期元素是组件动态渲染生成的，直接绑定click事件到.flatpickr-day.today时，元素可能还没渲染到DOM中，事件不会生效。
• 3. jQuery方法调用错误：你尝试的prop/attr/css都是jQuery实例方法，遍历option时的this是原生DOM对象，需要转为$(this)才能调用这些方法。

修复后完整代码 #

以下是兼容动态元素、计算逻辑正确的代码，支持删除或禁用option两种方案：

// 用事件委托绑定到静态上层容器，不会受flatpickr动态渲染影响
$(document).on('click', '.flatpickr-day.today', function () {
  // 正确计算当前时间的当日总分钟数
  const now = new Date();
  const currentTotalMinutes = now.getHours() * 60 + now.getMinutes();

  $(".mvvwb_sel_wrap select[name='mvvwb_timeStart'] > option").each(function() {
    const optionVal = parseInt($(this).val(), 10);
    if(optionVal < currentTotalMinutes) {
      // 方案1：直接移除选项
      // $(this).remove();

      // 方案2：禁用+隐藏（方便后续切换回其他日期时恢复选项）
      $(this).prop('disabled', true).hide();
    } else {
      // 切换非今日日期时需要恢复可选的话，可在此处添加恢复逻辑
      // $(this).prop('disabled', false).show();
    }
  });
});

注意事项 #

如果需要支持切换非今日日期时恢复所有可选option，可在flatpickr的日期切换回调中统一重置option状态，避免今日禁用的选项在选其他日期时依然不可用。

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