方法一次又一次调用

Question

我通过使用rest api对服务器进行ajax调用来验证电子邮件，我能够很好地完成这项工作，但我希望我的方法可以等待请求完成或等待2,3秒（无论标准）之前继续努力......

这是什么在代码发生的事情，

var regexEmail = /^([\w-]+(?:\.[\w-]+)*)@((?:[\w-]+\.)*\w[\w-]{0,66})\.([a-z]{2,6}(?:\.[a-z]{2})?)$/i; 
var $imgEmail = $("#emailValidateImg"); 
var $txtEmail = $("#txtEmail"); 
var ValidateEmailClientSide = function() { 
    $imgEmail.attr('src', waitImg).show(); 
    var email = $txtEmail.val(); 
    console.log(regexEmail.test(email)); 

    if (email && regexEmail.test(email)) { 
     ValidateEmailServerSide(); 
    } 
    else { 
     $imgEmail.attr('src', redImg).show(); 
     $(".form_row").slice(2, 5).show(); 
    } 
}; 
var ValidateEmailServerSide = function() { 
    $.getJSON(_spPageContextInfo.webAbsoluteUrl + "/_vti_bin/my/my.svc/Users/Exists/", { email: $txtEmail.val() }) 
     .done(function (data) { 
      $imgEmail.attr('src', greenImg).show(); 

      var $details = $(".form_row").slice(2, 5).show(); 
      var emailExists = data.UserExistsResult; 
      if (emailExists == 1) { 
       $details.hide(); 
      } 
     }) 
}; 
$txtEmail.on('keyup keypress blur change paste cut', ValidateEmailClientSide); 

我想包括在上面的代码超时，

也许我能做到这一点，

clearTimeout(ValidateEmailClientSide.timeout); 
ValidateEmailClientSide.timeout = setTimeout(function(){ 
    // Rest of code goes here 
}, 100); 

我想做什么

我想给用户开始验证之前一段时间，像2,3秒，如果用户开始与输入交互再次然后停止请求并再次等待2,3秒然后再发出请求。

Answer 1

您希望创建一个变量，例如ajaxRunning，该变量将保存ajax调用的状态; false - 未运行，true - 正在运行。如果false然后调用ajax函数，否则不要。当ajax调用开始运行时，将其设置为true，一旦完成，将其设置为false。这应该可以帮助您仅在没有运行Ajax调用时才进行ajax调用。

var $txtEmail = $("#txtEmail"); 
var ajaxRunning = false; // <<======= 
var ValidateEmailClientSide = function() { 
    $imgEmail.attr('src', waitImg).show(); 
    var email = $txtEmail.val(); 
    console.log(regexEmail.test(email)); 

    if (email && regexEmail.test(email) && !ajaxRunning) { //<<==== 
     ValidateEmailServerSide(); 
    } 
    else { 
     $imgEmail.attr('src', redImg).show(); 
     $(".form_row").slice(2, 5).show(); 
    } 
}; 
var ValidateEmailServerSide = function() { 
    ajaxRunning = true; //<<==== 
    $.getJSON(_spPageContextInfo.webAbsoluteUrl + "/_vti_bin/my/my.svc/Users/Exists/", { email: $txtEmail.val() }) 
     .done(function (data) { 
      ajaxRunning = false; //<<<===== 
      $imgEmail.attr('src', greenImg).show(); 

      var $details = $(".form_row").slice(2, 5).show(); 
      var emailExists = data.UserExistsResult; 
      if (emailExists == 1) { 
       $details.hide(); 
      } 
     }) 
}; 

但是，如果你想在客户端检查和服务器端的检查，以进行一次Ajax调用完成????，那么你想改变你的逻辑，使内的支票ajax回调。就使用超时而言，不能保证在设定的时间之后ajax调用将会完成。唯一的保证是回调。

Answer 2

您正在寻找的debounce功能：

http://davidwalsh.name/function-debounce

https://lodash.com/docs#debounce

var validateEmailServerSide = debounce(function() { 
    // … 
}, 2000); 

演示：http://codepen.io/anon/pen/JYdqVv?editors=101