jQuery Validate自定义远程checkmail方法仅首次生效问题求助

你的问题核心在于异步AJAX导致验证方法无法实时获取结果，加上全局变量的复用，使得后续验证始终沿用首次的状态。下面是具体的修复方案：

方案一：修复自定义验证方法 #

将AJAX改为同步请求，并避免使用全局变量存储错误信息，改用元素的data属性传递：

jQuery.validator.addMethod("checkmail", function (value, element) {
    var isValid = false;
    var errorMsg = '';
    
    // 关键：设置async: false，让AJAX同步执行
    $.ajax({
        type: 'POST',
        url: '/join/check-email/',
        data: { email: value },
        async: false,
        dataType: 'json', // 自动解析JSON，无需手动parse
        success: function (data) {
            if (data.response === 'ok') {
                isValid = true;
            } else {
                isValid = false;
                if (data.response === 'already') {
                    errorMsg = 'This email has already been used';
                } else if (data.response === 'notvalid') {
                    errorMsg = 'This email is not valid';
                }
            }
        }
    });
    
    // 将错误信息存在当前元素的data属性中
    $(element).data('checkmailError', errorMsg);
    return isValid;
}, function(params, element) {
    // 从元素data中读取最新的错误信息
    return $(element).data('checkmailError');
});

为什么原来的代码失效？ #

1. 异步AJAX的时序问题：自定义验证方法执行时，AJAX请求还在后台运行，方法直接返回了undefined，插件只能用首次的全局变量值作为结果。
2. 全局变量的复用问题：多次验证请求会覆盖validateEmailMessage的值，且插件可能缓存了错误提示函数的返回结果。

方案二：使用jQuery Validate内置的remote规则（推荐） #

插件内置的remote规则已经处理了异步验证的缓存和结果同步问题，代码更简洁：

$("#frm_join").validate({
    rules: {
        first_name: { required: true },
        last_name: { required: true },
        email: {
            required: true,
            email: true,
            remote: {
                type: 'POST',
                url: '/join/check-email/',
                data: {
                    email: function() {
                        return $("#email").val();
                    }
                },
                dataType: 'json'
            }
        },
        pass: {
            required: true,
            alphaNumeric: true,
            minlength: 8
        },
        pass_confirm: {
            required: true,
            minlength: 8,
            equalTo: "#pass"
        }
    },
    messages: {
        email: {
            remote: function(data) {
                // 根据后端返回的JSON动态生成错误信息
                if (data.response === 'already') {
                    return 'This email has already been used';
                } else if (data.response === 'notvalid') {
                    return 'This email is not valid';
                }
                return 'Invalid email';
            }
        }
        // 其他字段的提示信息
    },
    submitHandler: function (form) {
        // 表单提交逻辑
    }
});

对应PHP端调整（可选） #

如果想简化前端处理，PHP可以直接返回true（表示验证通过）或错误信息字符串（表示验证失败），比如：

• 邮箱可用时返回：echo json_encode(true);
• 邮箱已被使用时返回：echo json_encode('This email has already been used');

内容的提问来源于stack exchange，提问作者Frank Vêssia