等到ajax请求完成

Ala*_*ano 0 javascript ajax

这是一个javascript函数:

  function getValue(key) {
    var value;
    switch(_options.myType){
      case "cookie":
        value = readFromCookie(key);
        break;
      case "localStorage":
        value = readFromLocalStorage(key);
        break;
      case "db":
        //return value from the server
        // how do I wait for the result?
        $.ajax({
            type: "GET",
            url: "123",
            data: { .... },
            success: function(data){
               value = data; 
            }
        });
        break;
    }
    return value;
  };
Run Code Online (Sandbox Code Playgroud)

在发送ajax请求的情况下,我需要等待直到ajax请求完成.我该怎么做?

并非我不能在没有计算值的情况下离开函数.这意味着我不能在success:处理程序中放置一个函数,以后会返回值(或者我可能不明白?).所以必须在函数内计算getValue().

UPDATE

PS那么如何重构我的代码才能在success:处理程序中使用回调?这是代码的第二部分:

MyClass123.prototype.myMethod = function(value) {
      //..............
      var var1 = this.getValue("key1");
      if (var1 == "123") { ... }
      else { .... }
      //..............
    }
  };
Run Code Online (Sandbox Code Playgroud)

T.J*_*der 8

见下面的后续行动

可以使ajax请求同步,但这通常是一个坏主意(并且jQuery将不再支持它).

相反,请getValue接受回调:

function getValue(key, callback) {
   switch(_options.myType){
     case "cookie":
       setTimeout(function() {
           callback(readFromCookie(key));
       }, 0);
       break;
     case "localStorage":
       setTimeout(function() {
           callback(readFromLocalStorage(key));
       }, 0);
       break;
     case "db":
       //return value from the server
       // how do I wait for the result?
       $.ajax({
           type: "GET",
           url: "123",
           data: { .... },
           success: function(data){
              callback(data);
           }
       });
       break;
   }
}
Run Code Online (Sandbox Code Playgroud)

请注意,我使用setTimeoutreadFromCookiereadFromLocalStorage回调.为什么?因为if getValue 可能异步返回它的值,所以它应该总是这样做.使用超时0请求浏览器尽快将控制权返回浏览器(尽管它通常被限制在不低于5-10毫秒).


你的评论如下:

你读过我写的东西了吗?我说我出于某种原因不能这样做.

我错过了这一点,但是尽管如此,你可以.它可能需要对代码进行一些重构,但是你可以这样做,而且应该这样做.这就是现代Web应用程序的工作方式.如果您的结构不支持它,则需要修复结构.您可以async: false将请求用作临时解决方法,直到您可以正确执行.(嘿,我们都去过那里,不得不做那样的事情.)请注意,它计划在很长时间内退役(只需jQuery支持它,你仍然可以直接使用XHR来做同步请求).


更新您的更新问题,以下是更新该代码的方法:

MyClass123.prototype.myMethod = function(value) {
  this.getState("key1", function(var1) {
    //                           ^--- Note the var becomes an arg
    if var1 == "123"{ ... }
    else { .... }
  });
};
Run Code Online (Sandbox Code Playgroud)

请注意它实际变化的程度.用于跟随调用的逻辑getState转而进入您传递给它的回调.

  • 是的例子FTW (2认同)
  • @AlanDert:我错过了这一点,但在充分尊重的情况下,你**可以**.它可能需要对代码进行一些重构,但是你可以*做到,并且应该.这就是现代Web应用程序的工作方式.如果您的结构不支持它,则需要修复结构.(您可以在请求中使用[`async:false`](http://api.jquery.com/jQuery.ajax/#jQuery-ajax-settings)作为**临时**解决方法,直到您可以正确执行.) (2认同)