Question

我在AJAX循环内调用for请求，我期望在回调函数中使用迭代变量，但它不会保留调用者值，而是保留当前值

for (i = 1; i <= numRisks; i++){
    var id = window.localStorage['dbIDRisk'+i];
    if ($.isNumeric(id)){
        $.ajax({
            type: "POST",
            encoding:"UTF-8",
            url:'https://www.example.com/myscript.php',
            data: someXdata,
            success: function (data) {
                window.localStorage['Risk'+i+'PDF'] = 1;
            }
        });
    }
}

它工作正常，唯一的问题是，例如，如果迭代变量i = 1，我希望localStorage行是window.localStorage['Risk1PDF'] = 1;，而是window.localStorage['Risk2PDF'] = 1; 。问题是，如何在i的成功回调中保留window.localStorage['Risk'+i+'PDF'] = 1;的值？

Answer 1

您需要在此处使用IIFE来保存值。

＆＃13;

for (i = 1; i <= numRisks; i++) {
  var id = window.localStorage['dbIDRisk' + i];
  if ($.isNumeric(id)) {
    // Start the IIFE here.
    // The value of i is packed inside this function.
    (function (i) {
      $.ajax({
        type: "POST",
        encoding: "UTF-8",
        url: 'https://www.example.com/myscript.php',
        data: someXdata,
        success: function(data) {
          window.localStorage['Risk' + i + 'PDF'] = 1;
        }
      });
    })(i);
    // End the IIFE here.
  }
}

＆＃13;

到此时，处理AJAX请求，i值发生变化。最好将它包装在IIFE中并给予它。此外，在处理同步和异步共享数据时，您必须非常小心。外部i的值是同步的。当服务器响应时，AJAX可以随时执行。它有时可能是整个循环。 AJAX代码也同时执行。

Answer 2

使用Immediately-Invoked Function Expression，最简单，最易读的方法来封装索引变量：

for (i = 1; i <= numRisks; i++) {
  var id = window.localStorage['dbIDRisk' + i];
  if ($.isNumeric(id)) {
    (function (i) {
      $.ajax({
        type: "POST",
        encoding: "UTF-8",
        url: 'https://www.example.com/myscript.php',
        data: someXdata,
        success: function(data) {
            window.localStorage['Risk' + i + 'PDF'] = 1;
        }
      });
    })(i);
  }
}

另一种方法是使用let keyword.ES6引入新的let关键字，其范围与基于var的变量不同。例如，在基于let的索引的循环中，通过循环的每次迭代都会有一个新值i，其中每个值都在循环中作用域，因此您的代码将按预期工作。

for (let i = 1; i <= numRisks; i++){

}

另一种方法是使用closures。

详细了解here.

jQuery - 在AJAX请求中使用变量来获得成功回调

2 个答案: