如何让jQuery验证插件中Ajax验证结果作用于外层作用域？

你遇到的问题核心是Ajax请求的异步特性：$.get是异步执行的，你的return retval语句会在Ajax回调（done/fail）触发前就执行，所以retval始终是初始的true，无法反映Ajax请求的结果。

下面提供两种可行的解决方法：

方法一：使用插件内置的remote规则（推荐） #

jQuery Validation专门提供了remote规则用于处理异步Ajax验证，无需自己手动管理异步流程：

$("#你的表单ID").validate({
  rules: {
    // 替换成你的表单字段name属性值
    targetField: {
      required: true,
      remote: {
        url: "你的验证接口地址",
        type: "GET", // 根据接口要求选择GET/POST
        data: {
          // 可以传递额外参数，这里示例传递当前字段的值
          fieldValue: function() {
            return $("#targetField").val();
          }
        }
      }
    }
  },
  messages: {
    targetField: {
      remote: "该值不符合要求，请重新输入" // 自定义异步验证失败的提示
    }
  }
});

• 后端接口需要返回：验证通过返回true；验证不通过返回false或自定义错误字符串（字符串会直接作为错误提示）。

方法二：自定义异步验证方法 #

如果需要更复杂的业务逻辑，可以自定义异步验证方法，核心是使用插件提供的callback函数返回结果，而不是直接return：

// 自定义异步验证方法
$.validator.addMethod("customAsyncValidate", function(value, element, params, callback) {
  $.get("你的验证接口地址", { inputValue: value })
    .done(function(response) {
      // 根据接口返回的结果判断，调用callback传递验证状态
      // 示例：假设接口返回{valid: true}表示验证通过
      callback(response.valid);
    })
    .fail(function() {
      // 请求失败时直接标记为验证不通过
      callback(false);
    });
}, "验证失败，请稍后重试");

// 在表单验证中使用该规则
$("#你的表单ID").validate({
  rules: {
    targetField: {
      required: true,
      customAsyncValidate: true
    }
  }
});

• 注意：自定义异步方法时，插件会自动识别异步逻辑，只需在Ajax回调中调用callback函数传递true（通过）或false（不通过）即可。

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