技术问题：手动输入日期提交按钮启用，Datepicker选择时不启用

你绑定的onkeyup事件仅在用户通过键盘输入内容时触发，而Datepicker选择日期属于鼠标操作，不会触发键盘事件，导致manage函数未执行，提交按钮保持禁用状态。

将触发事件替换为input事件，该事件会在输入框值以任何方式变化时触发（包括键盘输入、Datepicker选择、粘贴内容等）。

方式1：修改内联事件 #

直接把onkeyup换成oninput，同时简化函数逻辑：

<html>
<body>
    <input type="date" id="txt" oninput="manage(this)" class="form-control" name="<?php echo 'actual_date__' . $cur['id'] . '__' . $cur['master_id'] ?>" value="<?php echo $filtered_row_result1["actual_date"] ?? ''; ?>" >
    <input type="submit" id="btSubmit" disabled />
</body>
<script>
    function manage(txt) {
        const bt = document.getElementById('btSubmit');
        bt.disabled = txt.value === '';
    }
</script>
</html>

方式2：使用事件监听（推荐） #

避免内联事件，用更规范的addEventListener绑定事件，同时覆盖多场景触发：

<html>
<body>
    <input type="date" id="txt" class="form-control" name="<?php echo 'actual_date__' . $cur['id'] . '__' . $cur['master_id'] ?>" value="<?php echo $filtered_row_result1["actual_date"] ?? ''; ?>" >
    <input type="submit" id="btSubmit" disabled />
</body>
<script>
    const txtInput = document.getElementById('txt');
    const submitBtn = document.getElementById('btSubmit');

    function updateButtonState() {
        submitBtn.disabled = txtInput.value === '';
    }

    // 绑定input事件覆盖所有值变化场景
    txtInput.addEventListener('input', updateButtonState);
    // 补充change事件，确保特殊场景也能触发
    txtInput.addEventListener('change', updateButtonState);

    // 页面加载时检查初始值，避免初始有值但按钮仍禁用
    window.addEventListener('load', updateButtonState);
</script>
</html>

针对jQuery UI Datepicker的额外处理 #

如果你的Datepicker是jQuery UI组件，可以在初始化时添加onSelect回调，直接在选择日期后更新按钮状态：

$("#txt").datepicker({
    onSelect: function(dateText) {
        $('#btSubmit').prop('disabled', dateText === '');
    }
});

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