0

2 つの別々の ajax 呼び出しを次々に行う必要があります。最初の呼び出しが成功した場合、最初の呼び出しの結果を 2 番目の呼び出しで使用する必要があります。これが私が試したものです：

$.ajax({
       url:myurl,     // myurl defined elsewhere
       type:'POST',
       data: mydata,  // mydata defined elsewhere

       success: function(data, textStatus) { 
           if (textStatus=='success'){
              // Get paramValue from the data
              // Here I want to call another similar ajax call
              callNextAjax(paramValue); // This function calls a similar ajax call. 
                                        // But always gets error call back there
           }
       },
       error: function(jqXHR, textStatus, errorThrown) {
           alert("First Request Failed");
       }     
});

function callNextAjax(paramValue){
  $.ajax({
           url:myurl1,     // myurl1 defined elsewhere
           type:'POST',
           data: mydata1,  // mydata1 defined elsewhere.  mydata1 uses paramValue

           success: function(data, textStatus) { 
               if (textStatus=='success'){
                  goToNewHtmlPage(); // open up a new html page in this function
               }
           },
           error: function(jqXHR, textStatus, errorThrown) {
               alert("Second Request Failed");
           }     
    });
}

callNextAjax() 関数は、値 paramValue を使用する同様の呼び出しです。callNextAjax 関数内では、常に「2 番目の要求が失敗しました」というアラートのエラー コールバックが返されます。callNextAjax を単独で (最初の ajax の成功関数内ではなく) 実行すると、正常に動作します ( goToNewHtmlPage() から次のページに移動します)。

私の実装で何が間違っていると思いますか? 私はこれで私の実験を使い果たしました。ここにあるどのタイプのポインタも役に立ちます。

4

2 に答える 2

0

うわー、Javascript のこの領域はしばしば混乱します。いくつかのソリューションがいかに複雑であるかに驚かされることがよくあります。一般に、jQuery と Javascript は非同期になるように設計されているため、同期コードをエレガントに作成することが困難になることがよくあります。これは、フロー制御ライブラリが得意とすることです。利用可能なフロー制御ライブラリがいくつかあります (特に、async には Node.js で大規模なユーザー ベースがあります) が、クライアント側 JS の場合、Frame.jsはこの問題を整理し、読み取り可能なコードを維持し、より大きな問題に拡張するのに非常に優れています。このタイプの。

Frame(function(next){
    $.ajax({
       url:myurl,     // myurl defined elsewhere
       data: mydata,  // mydata defined elsewhere
       success: function(data, textStatus) { 
           if (textStatus=='success'){
              // ... Get paramValue from the data
              next(paramValue);
           }
       },
       error: function(jqXHR, textStatus, errorThrown) {
           alert("First Request Failed");
           next();
       }     
    });
});
Frame(function(next, paramValue){
  if(paramValue){
    $.ajax({
        url:myurl1,     // myurl1 defined elsewhere
        data: mydata1,  // mydata1 defined elsewhere.  mydata1 uses paramValue
        success: function(data, textStatus) { 
            if (textStatus=='success'){
                next(secondParamValue);
            }
        },
        error: function(jqXHR, textStatus, errorThrown) {
            alert("Second Request Failed");
            next();
        }     
    });  
  }
});

Frame(function(next, secondParamValue){
  if(secondParamValue){
      goToNewHtmlPage(); // open up a new html page in this function
  } else {
      // do something else
  }
  next();
});

Frame.start();
于 2012-10-08T14:44:30.390 に答える
0

このようなことを試してください：

AjaxCheckResult = function() {

    var url = "http://url";

    return {

        errorfunction: function(jqXHR, textStatus, errorThrown) {
                   alert("First Request Failed");
        } ,
        sucessFunction: function(data, textStatus) { 
                   if (textStatus=="success"){
                     me.doAjax(paramValue);
                   }
               },

        doAjax: function(mydata){
            me = this;
            $.ajax({
               url:me.url,     // myurl defined elsewhere
               type:'POST',
               data: mydata,  // mydata defined elsewhere

               success: sucessFunction
               error: errorfunction
            });
        }
    };
}();

AjaxCheckResult.doAjax(Something);
于 2012-10-08T14:31:25.943 に答える