jQuery ajax 循环和迭代范围

我想知道为什么在下面的代码中i多变的仍然显示“5”而不是显示"1" then "2" then "3"等等 ？一定是范围问题，但我并没有真正理解它，因为我在全局和 dom 范围中更改了 i 变量的范围，但仍然遇到相同的问题。 当我警觉时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
}

这里是fiddle

EDIT :

我去了@图沙尔·古普塔解决方案，因为它最适合我的需求，但我遇到了另一个问题，如果我设置此选项，迭代将无法工作：处理数据：假

See the fiddle

为什么这不起作用？

这是由于 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); 
}