web-dev-qa-db-ja.com

jQuery ajax成功関数から配列を正しく返す方法は?

TheObject = {

    getArray: function(){
        var groups = new Array;
        $.ajax({
              type: "POST",
              url: "link.php",
              success: function (data){
                  var counter = 0;
                  $('g',data).each(function(){    
                      var group_name = $(this).find("name").text();
                      var group_id = $(this).find("id").text();
                      var group = {
                         id: group_id,
                         name: group_name
                      }
                      groups[counter] = group;
                      counter++;
                  });
                  return groups;
              }
         });
     }

}

そして、私がこのメソッドを呼び出そうとすると:

var a = TheObject.getArray();
alert(a);

'undefined'を返します。どこに問題があるのか​​わかりません。配列はsuccess関数内に作成されますが、正しく返すことができません。ご協力いただきありがとうございます!

13
ecu

あなたのコードでは、ajax呼び出しが行われた後、手続き型コーディングを使用してgroupsを探しています。主な問題は、ajax呼び出しが完了する前にgroupsを探していることです。

もう1つの問題は、グループをsuccess()関数に返しているのに、TheObject.getArray()関数が何も返さないことです。

したがって、次のようにコールバックをajax関数に取り込む必要があります。

TheObject = {
    getArray: function(callback) {
        var groups = new Array;
        $.ajax({
              type: "POST",
              url: "link.php",
              success: function (data){
                  var counter = 0;
                  $('g',data).each(function(){    
                      var group_name = $(this).find("name").text();
                      var group_id = $(this).find("id").text();
                      var group = {
                         id: group_id,
                         name: group_name
                      }
                      groups[counter] = group;
                      counter++;
                  });
                  callback.call(this,groups);
              }
         });
     }
}

TheObject.getArray(function(a) {
    // this code runs when the ajax call is complete
    alert(a);
});
16
David Hellsing

デビッドの例の非常に単純なバージョン。

TheObject = {
    getArray: function(callback) { 
        $.ajax({
              cache: true,
              type: "GET",
              url: "http://www.domain.com/core/domains.php",
              success: function (data){ 
                  callback.call(this,data);
              }
         });
     }
}

TheObject.getArray(function(data) {
    javascript: console.log(data);    
});
5
TheRealJAG

配列でPushを使用します。また、Groupというタイプを作成し、ループ内に新しいグループを作成して、それを配列にプッシュします。

0
Teja Kantamneni