jQuery验证，在继续之前等待服务调用响应

jQuery validation, waiting for service call response before proceeding

本文关键字：等待 服务 调用 响应 验证 继续 jQuery      更新时间：2023-10-10

我目前有一个jQuery方法来验证英国电话号码。这只是验证格式，并不能确保号码是真实的，所以我正在尝试一种电话验证服务。

下面的代码显示了jQuery验证方法，其最后一个IsValid（phone_number，'GB'）位调用处理服务的函数。

jQuery.validator.addMethod('phonesUK', function(phone_number, element) {
phone_number = phone_number.replace(/'(|')|'s+|-/g,'');
return this.optional(element) || phone_number.length > 8 &&
    phone_number.match(/^(?:(?:(?:00's?|'+)44's?|0)(?:1'd{8,9}|[23]'d{9}|8'd{7,9}|7(?:[45789]'d{8}|624'd{6})))$/)
    && IsValid(phone_number, 'GB');}, 'Please specify a valid UK phone number');

下面的代码处理对服务的调用，并且单独运行很好。

function IsValid(telephoneNumber, defaultCountry)
{ 
  var internationaltelephonevalidation = new data8.internationaltelephonevalidation();
  internationaltelephonevalidation.isvalid(
    telephoneNumber,
    defaultCountry,
    [
      new data8.option('UseMobileValidation', 'true'),
      new data8.option('UseLineValidation', 'true')
    ],
    showIsValidResult
  );
}
function showIsValidResult(result) {
  if (!result.Status.Success) {
    alert('Error: ' + result.Status.ErrorMessage);
  }
  else {
    if(result.Result.ValidationResult == "Invalid"){
      return false;
    }else{
      return true;
    }
  }
}

我的问题是，在服务返回响应之前，jQuery验证器方法返回false。

我确实在jQuery方法中尝试了设置超时，并在从showIsValidResult（）函数返回之前设置了一个变量，但该变量始终未定义。

有什么想法吗？

感谢

internationaltelephonevalidation.isvalid是一个异步XHR调用。它在IsValid函数中执行，但函数不等待响应。相反，它只是返回undefined，因为它是JavaScript中的默认返回语句。

isValid函数可以使用$.Deferred对象重写：

var funReady;
function IsValid(telephoneNumber, defaultCountry) {
  funReady = new $.Deferred();
  var internationaltelephonevalidation = new data8.internationaltelephonevalidation();
  internationaltelephonevalidation.isvalid(
    telephoneNumber,
    defaultCountry,
    [
      new data8.option('UseMobileValidation', 'true'),
      new data8.option('UseLineValidation', 'true')
    ],
    showIsValidResult
  );
  $.when(funReady).then(function() {
    // no action needed after $.Deferred is resolved/rejected.
    // just waiting for it to happen without leaving isValid
    // function ...
  });
  return funReady.state() === "resolved" ? true : false;
}

function showIsValidResult(result) {
  if (!result.Status.Success) { // http(s) request failed
    funReady.reject();
  }
  if(result.Result.ValidationResult == "Invalid") {
    funReady.reject();
  } else {
    funReady.resolve();
  }
}

Deferred对象返回一个promise。默认情况下，其状态为"挂起"，这意味着既不是"已解决"（成功）也不是"已拒绝"（失败）。当promise处于"挂起"状态时，$.when()函数会等待其状态更改为"已解决"/"已拒绝"。

一旦异步XHR请求完成/失败，就会以编程方式更改Deferred状态。

此解决方案是一个演示。您应该考虑检查$.Deferred是否已经创建，而不是为每个isValid调用重新创建新实例。这个建议可能还有其他边缘案例，但它应该会帮助你找到正确的答案。

相关文章：