如何用jQuery实现TUI Calendar点击过去日期时段不显示弹窗模态框？

问题分析 #

你当前的代码存在两个核心问题：

1. 日期逻辑错误：仅比较日期的「日(DD)」部分，完全忽略了月份和年份，跨月/跨年时判断会彻底失效（比如12月31日和1月1日，仅比日的话会误判）。
2. 体验与可靠性问题：先显示弹窗再延迟隐藏会导致闪烁，且依赖setTimeout获取DOM值的方式不可靠，可能因为DOM更新不及时导致取值错误。

修正后的jQuery代码 #

$(".tui-full-calendar-time-date").on('dblclick', function(){
    var dateVal = $(".date").val();
    var selectedDate = moment(dateVal);
    var currentDate = moment().startOf('day'); // 取当天0点，确保完整日期比较

    // 判断选中日期是否早于当前日期
    if (selectedDate.isBefore(currentDate)) {
        $('#addItem').modal('hide');
    } else {
        $('#addItem').modal('show');
    }
});

关键优化点 #

• 使用moment().startOf('day')将当前日期统一为当天0点，避免因当前时间（比如下午3点）导致当天上午的时段被误判为过去日期。
• 用moment的isBefore()方法直接比较完整日期，替代手动拼接日/月/年的错误逻辑。
• 移除setTimeout，直接获取日期值判断，避免DOM更新延迟带来的取值问题。
• 先判断再决定是否显示弹窗，彻底消除弹窗闪烁的不良体验。

更可靠的官方API方案（推荐） #

直接使用TUI Calendar提供的事件获取选中日期，无需依赖DOM元素，稳定性更高：

// 假设你已初始化calendar实例
var calendar = new tui.Calendar('#calendar', {
    // 你的日历配置项
});

// 绑定时段选中事件（双击时段触发）
calendar.on('selectTimeRange', function(event) {
    var selectedStartDate = moment(event.start);
    var currentDate = moment().startOf('day');

    if (selectedStartDate.isBefore(currentDate)) {
        $('#addItem').modal('hide');
    } else {
        $('#addItem').modal('show');
    }
});

内容的提问来源于stack exchange，提问作者Malik Zubair Mukhtar