Question

我有3个ajax电话。每个ajax调用的数据都传递给john_doe();

致电1

$.ajax({
        url: url1,
        dataType: "JSON",
        type: "GET",
      }).success(function(data1){

    john_doe(data1);
});

致电2

$.ajax({
        url: url2,
        dataType: "JSON",
        type: "GET",
      }).success(function(data2){

    john_doe(data2);
});

致电3

$.ajax({
        url: url3,
        dataType: "JSON",
        type: "GET",
      }).success(function(data3){

    john_doe(data3);
});

主要功能

function john_doe(param){
console.log(param); //Print data from all three ajax call.
}

如何在john_doe函数中分离data1，data2和data3？因为我需要进行算术运算。

目前，

输入

data1 = one,two,three
data2 = four
data3 = five

输出

console.log（param）将输出为

one
four
five

我希望输出为

console.log(param[0])
console.log(param[1])
console.log(param[2])

param[0] containing one,two,three
param[1] containing four
param[2] containing five

我无法控制数据。如何分别访问data1，data2和data3？

Answer 1

使用promises，您可以访问Promise.all（）回调中的所有数据，并一次性完成所需的任何操作。假设使用jQuery 3+。可以在旧版本中使用$.when

  var urls =['data-1.json','data-2.json','data-3.json'];
  // array of ajax promises
  var reqPromises = urls.map(function(url){
    return $.ajax({
       url: url,
       dataType: "JSON",
       type: "GET"
    });
  });

  Promise.all(reqPromises).then(function(res){
     // res is array of all the objects sent to each `$.ajax` from server
     // in same order that urls are in
     var param = res.map(function(item){
       return item.val
     });

     console.log(param)
  })

的 DEMO

Answer 2

快速而肮脏的解决方案只是传递一个标识符，为什么这很脏，因为它不是真正可扩展的，每次添加说第4或第5个调用时你需要添加更多标识符和你的if主方法中的陈述最终会变得非常丑陋。但这有时说＆＃34;保持简单＆＃34;没关系。

主要功能：

function john_doe(identifier, param) {

    // best to use something more readable then numbers
    if(identifier == 1) {    
       console.log(param); //Print data from all ajax call 1.
    } else if(identifier == 2) {
       console.log(param); //Print data from all ajax call 2.
    } else if(identifier == 23) {
       console.log(param); //Print data from all ajax call 3.
    } else {
       // handle bad id
    }
}

在您的ajax调用中，传入正确的标识符，例如调用2 ：

    $.ajax({
        url: url2,
        dataType: "JSON",
        type: "GET",
      }).success(function(data2){

    // numeric 2 in in the first param is your identifier
    john_doe(2,data2); });

Answer 3

添加一个参数，让您知道从哪里调用

致电1

$.ajax({
        url: url1,
        dataType: "JSON",
        type: "GET",
      }).success(function(data){

    john_doe('call1',data);
});

致电2

$.ajax({
        url: url2,
        dataType: "JSON",
        type: "GET",
      }).success(function(data){

    john_doe('call2',data);
});

致电3

$.ajax({
        url: url3,
        dataType: "JSON",
        type: "GET",
      }).success(function(data){

    john_doe('call3',data);
});

主要功能

function john_doe(call,data){
    console.log('Called from : ' + call);
    console.log(data); //Print data from all three ajax call.
}

Answer 4

这个怎么样？声明一个对象容器来保存您的响应数据值和算术运算函数。

var myParams = {
    all_params: [],
    getParams: function(){
        return this.all_params;
    },
    setParam: function(index, data){
        this.all_params[index] = data;
    },
    yourArithmeticOperation: function(){
        console.log(this.all_params); // your actual logic using all 3 ajax response data
    }
}

然后，在你的ajax调用中：

// call 1
$.ajax({
    url: url1,
    dataType: "JSON",
    type: "GET",
}).success(function(data){
   myParams.setParam(0, data); // add ajax 1 response data
});

// call 2
$.ajax({
    url: url1,
    dataType: "JSON",
    type: "GET",
}).success(function(data){
   myParams.setParam(1, data); // add ajax 2 response data
});

// call 3
$.ajax({
    url: url1,
    dataType: "JSON",
    type: "GET",
}).success(function(data){
   myParams.setParam(2, data); // add ajax 3 response data
});

如果您需要所有回复数据，

// after all three ajax calls
params = myParams.getParams();
console.log(params);

最后，你的算术运算，

myParams.yourArithmeticOperation();

Answer 5

尝试将async: false添加到您的ajax调用

$.ajax({
        url: url1,
        dataType: "JSON",
        type: "GET",
        async: false,
      }).success(function(data){

    john_doe('call1',data);
});

多个ajax调用单个函数javascript

5 个答案: