Javascript jQuery ajax循环和迭代范围

我想知道为什么在下面的代码中，I变量仍然显示“5”而不是显示“1”然后“2”然后“3”等等？这一定是一个范围问题，但我并没有真正理解它，因为我在全局和dom范围中更改了I变量的范围，但仍然遇到同样的问题。 当我在ajax函数之外发出警报时，它工作得很好

for (var i = 0; i < 5; i++) {   
   $.ajax({
        url: '/echo/html/',
        method:'post',
        data: {
            html: 'Ajax data'
        },
        success: function (resp) {
            $('#success').append(i) // always 5
        }
    })
    $('#outsideAjax').append(i); // is okay
}

（变量i=0；i<5；i++）的

$.ajax({
url:“/echo/html/”，
方法：'post'，
数据：{
html:“Ajax数据”
},
成功：功能（resp）{
$（'#success'）。附加（i）//始终为5
}
})
$（“#outsideAjax”）.append（i）；//可以吗
}

这是你的电话号码

编辑：

我选择了@Tushar Gupta解决方案，因为它最适合我的需要，但我遇到了另一个问题，如果我设置此选项，迭代将无法工作：processData:false

见

---

这为什么不起作用？

这是由于JavaScript中的闭包造成的。这是解决办法-

for (var i = 0; i < 5; i++) { 
   (function(i){
    $.ajax({
        url: '/echo/html/',
        method:'post',
        data: {
            html: 'Ajax data'
        },
        success: function (resp) {
            $('#success').append(i) 
        }
    })
    })(i);

    $('#outsideAjax').append(i); 
}

（变量i=0；i<5；i++）的

（职能（一）{
$.ajax({
url:“/echo/html/”，
方法：'post'，
数据：{
html:“Ajax数据”
},
成功：功能（resp）{
$（'#success'）。附加（i）
}
})
})（i） )；
$（“#outsideAjax”）。追加（i）；
}

这是由于JavaScript中的闭包造成的。这是解决办法-

for (var i = 0; i < 5; i++) { 
   (function(i){
    $.ajax({
        url: '/echo/html/',
        method:'post',
        data: {
            html: 'Ajax data'
        },
        success: function (resp) {
            $('#success').append(i) 
        }
    })
    })(i);

    $('#outsideAjax').append(i); 
}

（变量i=0；i<5；i++）的

（职能（一）{
$.ajax({
url:“/echo/html/”，
方法：'post'，
数据：{
html:“Ajax数据”
},
成功：功能（resp）{
$（'#success'）。附加（i）
}
})
})（i） )；
$（“#outsideAjax”）。追加（i）；
}

解决方案使用：

（变量i=0；i<5；i++）的

$.ajax({
url:“/echo/html/”，
方法：'post'，
数据：{
html:“Ajax数据”
},
成功：（功能（i，resp）{
$（'success'）。附加（i）；
}).bind（null，i）
});
$（“#outsideAjax”）。追加（i）；
}

解决方案使用：

（变量i=0；i<5；i++）的

$.ajax({
url:“/echo/html/”，
方法：'post'，
数据：{
html:“Ajax数据”
},
成功：（功能（i，resp）{
$（'success'）。附加（i）；
}).bind（null，i）
});
$（“#outsideAjax”）。追加（i）；
}

var i=0；
函数ajax_call（）{
$.ajax({
url:“/echo/html/”，
方法：“post”，
数据：{
html:“Ajax数据”
},
成功：功能（resp）{
$（'#success'）。追加（i++）；
如果（i<5）{
ajax_call（）；
}
}
});
$（“#outsideAjax”）。追加（i）；
};
ajax_call（）；

var i=0；
函数ajax_call（）{
$.ajax({
url:“/echo/html/”，
方法：“post”，
数据：{
html:“Ajax数据”
},
成功：功能（resp）{
$（'#success'）。追加（i++）；
如果（i<5）{
ajax_call（）；
}
}
});
$（“#outsideAjax”）。追加（i）；
};
ajax_call（）；

您可以使用闭包修复此问题，将i:

for (var i = 0; i < 5; i++) {   
   (function(val){
      $.ajax({
          url: '/echo/html/',
          method:'post',
           data: {
               html: 'Ajax data'
           },
           success: function (resp) {
               $('#success').append(val);
           }
       })
       $('#outsideAjax').append(val); // is okay
     })(i);
}

（变量i=0；i<5；i++）的

（功能（val）{
$.ajax({
url:“/echo/html/”，
方法：'post'，
数据：{
html:“Ajax数据”
},
成功：功能（resp）{
$（'#success'）。追加（val）；
}
})
$（“#outsideAjax”）.append（val）；//可以吗
})（i） )；
}

您可以使用闭包修复此问题，将i:

for (var i = 0; i < 5; i++) {   
   (function(val){
      $.ajax({
          url: '/echo/html/',
          method:'post',
           data: {
               html: 'Ajax data'
           },
           success: function (resp) {
               $('#success').append(val);
           }
       })
       $('#outsideAjax').append(val); // is okay
     })(i);
}

（变量i=0；i<5；i++）的

（功能（val）{
$.ajax({
url:“/echo/html/”，
方法：'post'，
数据：{
html:“Ajax数据”
},
成功：功能（resp）{
$（'#success'）。追加（val）；
}
})
$（“#outsideAjax”）.append（val）；//可以吗
})（i） )；
}

Iterate完成，当到达第一个和后续AJAX请求的

success

回调时，

i

为5。阅读JSIterate中的闭包完成，当到达第一个和后续AJAX请求的

success

回调时，

i

为5。阅读JSOr中使用闭包的闭包对于

$.ajax

@Vega，我同意，但我更喜欢

bind（）

：-）谢谢，最好的方法是什么，是@shryas编写的还是你的？我的意思是，跨浏览器兼容性是明智的。@tcj如果你的目标是IE8而没有polyfills，我会选择Shreyas代码，否则我的！或者对

$使用闭包。ajax

@Vega我同意，但我更喜欢

bind（）

：-）谢谢，最好的方法是什么，是@shryas编写的还是你的？我的意思是，跨浏览器兼容性是明智的。@tcj如果你的目标是IE8而没有polyfills，我会选择Shreyas代码，否则我的@tcj无法保证您获得序列号

012345

请参阅-->@Tushar Gupta，您是对的，我已经测试了其他函数，但只有您的函数能够按顺序呈现数字，谢谢您的提及。@tcj无法保证您获得序列号

012345

请参阅-->@Tushar Gupta，您是对的，我已经测试过其他函数，但是只有你的函数能够按顺序显示数字，谢谢你的提醒。在我看来，最好的解决方案是，其他代码都是随机显示数字。谢谢大家!@tcj此解决方案不进行并行调用。它等待每个响应返回，然后进行下一次调用。如果这就是你需要的，那么这就是正确的方法。@Shreyas:这正是我需要的，谢谢你的帮助。在我看来，最好的解决方案是，其他代码都是随机显示数字。谢谢大家!@tcj此解决方案不进行并行调用。它等待每个响应返回，然后进行下一次调用。如果这就是你需要的，那么这就是正确的方法。@shryas:这正是我需要的，谢谢