JavaScript日期校验功能跨时区失效，仅可使用JS或jQuery修复

问题原因 #

• 原有校验逻辑依赖toISOString()转换时间，该方法返回的是UTC时区的时间，不同时区下同一个本地日期转UTC后会出现日期偏移，最终导致跨时区判断出错
• 额外存在选择器不匹配问题：JS中使用$('#error-msg3')选中错误提示，但HTML里错误标签的id为error，会导致提示无法正常展示

修复后的代码 #

JS部分 #

dateFormat = function(value, event) {
    let newValue = value.replace(/[^0-9]/g, '').replace(/(\..*)\./g, '$1');
    const dayOrMonth = (index) => index % 2 === 1 && index < 4;
    // 处理删除输入的场景
    if (!event.data) {
        return value;
    }
    return newValue.split('').map((v, i) => dayOrMonth(i) ? v + '/' : v).join('');
}

checkStart = function(value) {
    // 先校验输入格式是否完整，避免无效输入导致判断异常
    if (!/^\d{2}\/\d{2}\/\d{4}$/.test(value)) {
        $('#error').hide();
        return;
    }
    // 拆分用户输入的月/日/年
    const [inputMonth, inputDay, inputYear] = value.split('/').map(Number);
    // 完全基于本地时区获取当前日期的年、月、日
    const now = new Date();
    const currentYear = now.getFullYear();
    const currentMonth = now.getMonth() + 1; // JS原生getMonth返回0-11，需+1匹配实际月份
    const currentDay = now.getDate();

    // 直接对比日期数值，完全避免时区转换带来的偏移问题
    let isBeforeToday = false;
    if (inputYear < currentYear) {
        isBeforeToday = true;
    } else if (inputYear === currentYear) {
        if (inputMonth < currentMonth) {
            isBeforeToday = true;
        } else if (inputMonth === currentMonth && inputDay < currentDay) {
            isBeforeToday = true;
        }
    }

    if (isBeforeToday) {
        $('#error').show();
        $('#startDate').val('');
    } else {
        $('#error').hide();
    }
}

HTML部分 #

<input type="tel" maxlength="10" id="startDate" name="startDate" placeholder="mm/dd/yyyy"
       oninput="this.value = dateFormat(this.value, event)" onblur="checkStart(this.value)" required/>

<span id="error" style="display:none;color:red;">Start date should not be lesser than the current date.</span>

<script src="https://code.jquery.com/jquery-3.6.0.js"></script>

修复说明 #

• 去掉了所有toISOString()相关的UTC时间转换逻辑，所有日期取值都使用本地时区的对应方法，确保跨时区时判断基准和用户输入的时区完全一致
• 新增了输入格式校验，避免不完整的日期输入导致判断错误
• 统一了错误提示的选择器，同时默认隐藏错误提示，避免页面加载时就展示错误信息

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