求助：jQuery键盘输入校验与表单提交校验的联动实现

1. 提取通用校验函数 #

把输入框的校验逻辑抽成独立函数，让实时校验和提交校验共用一套规则，避免出现逻辑不一致的情况：

function validateTitle() {
    const titleVal = $("#title").val().trim(); // 处理首尾空格，防止纯空格绕过校验
    if (titleVal === "") {
        $("#errorMsg").html('This field is required');
        return false;
    } else {
        $("#errorMsg").html('');
        return true;
    }
}

2. 改造keyup实时校验 #

原有的keyup事件直接调用这个校验函数，实现实时提示：

$("#title").on("keyup", function(e) {
    validateTitle();
});

3. 完善提交按钮校验逻辑 #

点击提交按钮时，调用校验函数，根据返回结果执行对应操作：

$('#save_btn').on('click', function(e){
    e.preventDefault();
  
    if (!validateTitle()){
        alert('Fix your errors first!');
    } else {
        alert('Validation Successful');
        // 校验通过后，在这里执行你的Ajax提交逻辑即可
        // 比如：$.ajax({ ... }) 或者 $("#yourForm").submit();
    }
});

额外说明 #

• 加入.trim()是为了过滤用户输入的纯空格，如果你不需要这个规则，直接去掉.trim()即可。
• 把校验逻辑抽成独立函数后，后续修改校验规则（比如限制输入长度、禁止特殊字符）时，只需要修改validateTitle函数，所有用到校验的地方都会同步更新，维护更高效。

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