ループ内のJQueryポストメソッド内で一度のアラートを取得するには？

Question

私はループの中にデータを投稿するので、投稿するデータが4つあり、応答データを4回取得します。 その後、私は4回目の警告を受けるが、私は4つのデータ投稿の後に1回の警告を表示したい。

<script> 
 

 
\t $('#save').on('click',function(){ \t 
 
\t \t var i =1; 
 
\t \t //i have 4 item 
 
\t \t $('.item').each(function() { \t \t 
 
\t \t \t 
 
\t \t \t $.post("example.php", { id: i }) 
 
\t \t \t .done(function(data) { 
 
\t \t \t \t \t \t \t 
 
\t \t \t \t alert(0); // just one time 
 
\t \t \t \t 
 
\t \t \t  
 
\t \t \t }); 
 

 
\t \t \t i++; \t 
 
\t \t }); 
 
\t \t \t 
 

 
     }) 
 
</script>

Answer 1

これはあなたを助けることを願っています

<script> 

$('#save').on('click',function(){ 
    var i =1; 
      var cnt=0; 
    //i have 4 item 
    $('.item').each(function() {   

     $.post("example.php", { id: i }) 
     .done(function(data) { 
      cnt++; 
        if (cnt==4) { 
         alert(0); //for one time after all items post. 
        } 

     }); 

     i++;  
    }); 


     }) 
</script> 

なコードを試してみてください！

Answer 2

次のようにカウンタを設定してみることができます。あなたはすべての要求を収集し、1が成功かを確認し、その1失敗した可能性がありjQuery.ajaxcompleteイベント

でjQuery.when()とdeferred.resolveを使用することにより

$('#save').on('click',function(){ 
    var i =1; 
    var counter = $('.item').length -1; 
    //i have 4 item 
    $('.item').each(function() {   
     $.post("example.php", { id: i }) 
     .done(function(data) { 
       if(counter == 0) 
        alert(0); //for one time after all items post.    
      counter = counter ==0 ? 0: counter -1; 
     }); 
     i++;  
    }); 
}); 

Answer 3

。

下記のコードを実行してみてください。ただし、stackoverflowにはexample.phpが存在しないので、4つのリクエストがすべて失敗したことに注意してください。

jQuery(function($) { 
 

 
    // make all requests 
 
    var requests = $('.item').map(function(idx, elm) { 
 
    var deferred = $.Deferred(); 
 

 
    $.ajax({ 
 
     method: 'post', 
 
     url: 'example.php', 
 
     data: { id: idx + 1 }, 
 
     complete: deferred.resolve 
 
    }); 
 

 
    return deferred; 
 
    }); 
 

 
    // when all requests are done. 
 
    $.when.apply($, requests).done(function() { 
 

 
    var stats = { success: 0, error: 0 }; 
 

 
    // count how many of them succeed or failed. 
 
    for (var i = 0; i < arguments.length; i++) { 
 
     stats[arguments[i][1]]++; 
 
    } 
 

 
    // print resullt. 
 
    console.log(
 
     arguments.length + ' Requests completed, ' + 
 
     stats.success + ' Succeeded, ' + 
 
     stats.error + ' Failed.' 
 
    ); 
 

 
    }); 
 

 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<button id="save">Save</button> 
 

 
<div class="item">Item 1</div> 
 
<div class="item">Item 2</div> 
 
<div class="item">Item 3</div> 
 
<div class="item">Item 4</div>