使用.done()而不是成功更改第二个请求的ajax POST数据

时间:2017-11-23 18:53:00

标签: javascript jquery ajax

我在这里有点困惑。

我已经编写了一堆Ajax函数,这些函数在前一个有效success响应之后连续相互触发。

示例...(我已删除了检查各种data.response代码的大部分代码,以使其更清晰。)

var var1 = "";
var var2 = "";
var var3 = "";

$(document).ready(function(){
    functionOne();
});

function functionOne() {
    $.ajax({
        url: "http://somewebsite.com/api/index.php",
        dataType: "json",
        method: "POST",
        cache: false,
        data : {
                "action": "new",
                "id": 1234,
                "amount": 10
        },
        success: function(data) {

            if(data.response == "Y") {
              var1 = data.var1;
              var2 = data.var2;
              var3 = data.var3
              functionTwo(var1, var2, var3);
            }

        },
        error : function(xhr, status) {
          console.log("something went wrong");
        },
        timeout: 200000
   });
}

functionTwo(var1, var2, var3) {
   $.ajax({
      url: "http://somewebsite.com/api/index.php",
      dataType: "json",
      method: "POST",
      cache: false,
      data : {
              "action": "check",
              "id": var1,
              "amount": var2,
              "var3" : var3
      },
      success: function(data) {

          if(data.response == "Y") {
            var1 = data.var1;
            var2 = data.var2;
            var3 = data.var3
            functionThree(var1, var2, var3);
          }

      },
      error : function(xhr, status) {
        console.log("something went wrong");
      },
      timeout: 200000,
  });  
}

等等......

但我现在计划将它们全部移动到一个单一的功能中,这将在最后吐出所有功能的结果。

我打算使用success:来嵌套Ajax请求,但之后开始阅读.done()以及这是一个更好的方法,特别是对于像这样的链接函数。

但我对如何使用此方法将不同的POST数据和变量发送到后续调用感到困惑。

我已经看过here,但它没有详细说明如何为新请求传递新的POST数据元素。

 asyncCall()
 .then(function(data1){
  // do something...
  return anotherAsyncCall();
 })
 .then(function(data2){
  // do something...  
  return oneMoreAsyncCall();    
 })
 .then(function(data3){
  // the third and final async response
 })
 .fail(function(err) {
  // handle any error resulting from any of the above calls    
 })
 .done();

有人可以向我展示一个粗略的例子,说明如何使用functionOne.done()functionTwo调用functionOne传递new和{{1}中创建的三个变量第二个Ajax请求的data: action

1 个答案:

答案 0 :(得分:0)

编辑为更具描述性

取自https://stackoverflow.com/a/43173453/7357832

$(document).ready(function () {
  functionOne()
    .done(function (data) {
      //any other validation code can go in here
      if (data.response == "Y")
        return functionTwo(data.var1, data.var2, data.var3);
    })
    .done(function (data) {
      //this is the response for functionTwo. Another .done() can be created for a third function etc.
    })
    .fail(function (xhr, status) {
      console.log("something went wrong");
    })
});


function functionOne() {
  return $.ajax({
    url: "http://somewebsite.com/api/index.php",
    dataType: "json",
    method: "POST",
    cache: false,
    data: {
      "action": "new",
      "id": 1234,
      "amount": 10
    },
    timeout: 200000
  })
}

function functionTwo(var1, var2, var3) {
  return $.ajax({
    url: "http://somewebsite.com/api/index.php",
    dataType: "json",
    method: "POST",
    cache: false,
    data: {
      "action": "check",
      "id": var1,
      "amount": var2,
      "var3": var3
    },
    timeout: 200000,
  });
}