Question

我目前有一个验证英国电话号码的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方法中的set timeout，并在从showIsValidResult（）函数返回之前设置了一个变量，但变量总是未定义的。

有什么想法吗？

由于

Answer 1

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

可以使用$.Deferred object：

重写isValid函数

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();
  }
}

延迟对象返回一个promise。默认情况下，其状态为＆＃34; pending＆＃34;，这意味着＆＃34;已解决＆＃34; （成功）也没有＆＃34;拒绝＆＃34; （失败）。虽然承诺正在等待＆＃34;州，$.when()函数等待其状态更改为＆＃34;已解决＆＃34; /＆＃34;已拒绝＆＃34;。

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

此解决方案是一个演示。您应该考虑检查是否已创建$.Deferred，而不是为每个isValid调用重新创建新实例。此提案中可能存在其他边缘情况，但它可以帮助您找到正确的答案。

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

1 个答案: