在for循环javascript结束时执行操作

Perform action at end of for loop javascript

本问题已经有最佳答案,请猛点这里访问。

我一直在尝试在for循环完成后重定向页面,但它在for循环之前执行它,即使代码在for循环之外。 所以我想知道在使用JavaScript完成for循环之后是否有某种方式执行代码并重定向到另一个页面。 这是我的代码。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
$('#submit').click(function(e) {
   e.preventDefault();
   var total = $('#total').val();

   for (var i = 0; i < total; i++) {
     if ($('#check_' + i).is(':checked')) {
       // The string to be posted to the submit file
       var dataString = 'month=' + month + '&year=' + year + '&patient_id=' + patient_id;

       // AJAX code to submit form.
       $.ajax({
         type:"POST",
         url:"pages/views/payroll/bulk_payroll_functions.php",
         data: dataString,
         cache: false,
         success: function(result) {
           alert("good");
         }
       });
     }
   }
   alert("All members payrolls made");
   window.location = ("index.php?lang=en&page=view_payroll");
})


代码正如您所期望的那样工作 - 正在进行AJAX请求。 但是,由于它们是异步的,因此无法保证在重定向之前它们已完成。

最简单的方法是使用$.ajax返回的Promises。

然后,您可以在完成所有ajax请求时使用$.when重定向:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
$('#submit').click( function(e) {
  e.preventDefault();

  // array to store the promises
  var promises = [];

  var total = $('#total').val();

  for(var i = 0; i < total; i++){
    if($('#check_' + i).is(':checked')){
      // The string to be posted to the submit file
      var dataString = 'month=' + month + '&year=' + year + '&patient_id=' + patient_id ;

      // AJAX code to submit form.
      promise = $.ajax({
        type:"POST",
        url:"pages/views/payroll/bulk_payroll_functions.php",
        data: dataString,
        cache: false,
        success: function (result) {
          alert("good");
        }
      });

      // add ajax request to the promises
      promises.push(promise);
    }
  }

  // redirect when all promises have resolved
  $.when(promises).then(function () {
    alert("All members payrolls made");
    window.location = ("index.php?lang=en&page=view_payroll");
  });
});