2015-05-20 27 views
-1

我對我的AJAX請求的結果使用each(),我的代碼如下:jQuery的每個Ajax的

<script type="text/javascript"> 
    function my_function() { 
     str = []; 
     $i = 0; 
     $(".div_class").each(function() { 
      var id = $(this).attr('id'); 
      $.ajax({ 
       type: 'post', 
       url: 'my_url', 
       cache: false, 
       data: {id: id}, 
       success: function(data) { 
        alert(data.result); // alert 1 
        str.push({$i : data.result}); 
       } 
      }); 
      $i++; 
     }); 
     alert(JSON.stringify(str)); // alert 2 
    } 
</script> 

我得到結果alert(data.result)

問題是警報2 alert(JSON.stringify(str));首先出現並且爲空值。

是否有人知道問題是什麼?

回答

0

問題是因爲AJAX請求是異步。這意味着腳本在等待返回值時繼續執行 - 這就是爲什麼您在alert 1之前看到alert 2

當與異步方法工作,所有代碼依賴於請求應該被放置在回調函數。換句話說,alert 2必須放置裏面success處理函數。

0

由於您的ajax調用是異步調用,因此語句alert(JSON.stringify(str));將在ajax調用之後立即執行,並且不會等待請求完成。如果你想字符串化,然後做在successdone方法

0

的問題是AJAX的異步性要求

您可以使用$。當()

function my_function() { 
    var requests = []; 
    var str = []; 
    $(".div_class").each(function() { 
     var id = $(this).attr('id'); 
     var req = $.ajax({ 
      type: 'post', 
      url: 'my_url', 
      cache: false, 
      data: { 
       id: id 
      }, 
      success: function (data) { 
       alert(data.result); // alert 1 
       str.push({ 
        $i: data.result 
       }); 
      } 
     }); 
     requests.push(req); 
    }); 

    $.when.apply($, requests).done(function() { 
     alert(JSON.stringify(str)); // alert 2 
    }) 
} 

如果你想主要順序的項目,那麼你可以

function my_function() { 
    var requests = $(".div_class").map(function() { 
     var id = this.id; 
     return $.ajax({ 
      type: 'post', 
      url: 'my_url', 
      cache: false, 
      data: { 
       id: id 
      }, 
      success: function (data) { 
       alert(data.result); // alert 1 
      } 
     }); 
    }).get(); 

    $.when.apply($, requests).done(function() { 
     var str = $.map(arguments, function (arr) { 
      return arr[0].result; 
     }) 
     alert(JSON.stringify(str)); // alert 2 
    }) 
} 

演示:Fiddle