Question

这是我的代码：

for (var i = 0; i < 20; i++) {
$.ajax({
    type: "GET",
    async: false,
    url: "/MyController/MyMethod",
    success: function (data) {
        if (i == 0) {
            $('#result_progress').hide();
            $('#result_msg').hide();
            $('#details').show();
        } else if (i == 1) {
            $.ajax({
            type: "GET",
            async: true,
            url: "/Import/Finish",
            success: function (data) {
                    ....                        
            });                                            
        }
        if (i < 2) {
            $('#details').html($('#details').html() + 'someText'));
        }                                        
    }
});

}

我不想使用async：false，因为我的浏览器停止工作。我将如何以另一种方式解决这个问题？

Answer 1

你的问题是i在执行回调时具有循环结束的值。

要解决的标准解决方案是添加一个中间立即调用的函数来保护i的值：

for (var i = 0; i < 20; i++) {
   (function(i){
      ... your code
   })(i);
}

对函数的调用会创建一个范围，其中i是另一个变量。

Answer 2

我认为你应该做一些关闭：

function makeReq(n){
   return function(){
      $.ajax({
        type: "GET",
        async: true,
        url: "/MyController/MyMethod",
        success: function (data) {
           if (n == 0) {
              $('#result_progress').hide();
              $('#result_msg').hide();
              $('#details').show();
           } else if (n == 1) {
              $.ajax({
                type: "GET",
                async: true,
                url: "/Import/Finish",
                success: function (data) {
                    ....                        
                });                                            
           }
           if (n < 2) {
               $('#details').html($('#details').html() + 'someText'));
           }                                        
       }
     });
   }
}

for (var i = 0; i < 20; i++) {
    makeReq(i);
}

这个问题可以通过创建一个函数并在循环的每次迭代中调用它来解决，同时传递i;调用该函数将形成一个全新的执行上下文，其中i的值被保留，并且可以在该上下文中以任何方式使用。

Answer 3

以下是我修复它的方法：

function run(i, howManyToRun, start) {
    if(i >= howManyToRun) return;

    $.ajax({
        type: "GET",
        async: false,
        url: "/MyController/MyMethod",
        success: function (data) {        
            ....
            run(++i, howManyToRun, start);
            ....                                    
        }
    });
}

for循环中的Ajax请求

3 个答案: