jQuery控制HTML单选框自动填入当前日期时间功能不稳定如何修复

算力阿峰

2026-9-28

问题原因

格式不匹配：原生<input type="date">要求值必须为YYYY-MM-DD格式，<input type="time">要求值必须为HH:mm格式，单个位数的月、日、时、分都需要补前导零。你当前代码直接拼接日期时间，生成的2024-1-3、9:5这类格式不符合输入框要求，就会出现控制台能正常打印、但页面输入框赋值不生效的问题。
事件选择不合理：使用click事件监听单选框状态变化，可能出现点击触发时单选框选中状态还未更新，导致逻辑判断异常。

修复方案

替换原有JS代码即可，修复后代码如下：

$('input[name=flexRadioDefault]:radio').on('change', function () {
    if($('#flexRadioDefault2').is(':checked')) {
        const now = new Date();
        // 处理日期，补前导零
        const year = now.getFullYear();
        const month = String(now.getMonth() + 1).padStart(2, '0');
        const day = String(now.getDate()).padStart(2, '0');
        const datecreated = `${year}-${month}-${day}`;
        
        // 处理时间，补前导零
        const hour = String(now.getHours()).padStart(2, '0');
        const minute = String(now.getMinutes()).padStart(2, '0');
        const servicetime = `${hour}:${minute}`;

        $('#servicedate').val(datecreated).prop('disabled', true);
        $('#servicetime').val(servicetime).prop('disabled', true);
    } else {
        $('#servicedate').val('').prop('disabled', false);
        $('#servicetime').val('').prop('disabled', false);
    }
})

本次修改点：