jQuery Ajax调用循环丢失本地变量引用

Question

我在一个循环内做了几个jQuery ajax调用。每次有一个ajax调用返回时，我需要引用一个对应于原始ajax调用的值。我目前的代码无法正常工作，因为lskey变量的值已被进一步的循环迭代所改变。

下面是代码：

for (var i = 0, len = localStorage.length; i < len; i++) { 
     var lskey = localStorage.key(i); 
     if (lskey.substr(0, 4) === 'form') { 
      var postdata = localStorage.getItem(lskey); // Get the form data 
      $.ajax({ 
       type: "POST", 
       async: "false", 
       url: "/Profile/PostForm", 
       data: postdata, 
       success: function (data) { 
        $('#rollinginfo').append('<br>' + data + ',key=' + lskey); 
        localStorage.removeItem(lskey); // Remove the relevant localStorage entry 
       } 
      , error: function (data) { $('#rollinginfo').append('<br />ERR:' + data); } 
      }); 


     } 
    } 

的问题是，lskey是每执行一次循环被改变，因此，成功回调不必说当时存在lskey值的参考的通话。

如何为每个成功回调引用lskey的正确值？

Answer 1

for (var i = 0, len = localStorage.length; i < len; i++) { 
    var lskey = localStorage.key(i); 
    if (lskey.substr(0, 4) === 'form') { 
     var postdata = localStorage.getItem(lskey); // Get the form data 
     $.ajax({ 
      type: "POST", 
      async: "false", 
      url: "/Profile/PostForm", 
      data: postdata, 
      local_lskey: lskey 
      success: function (data) { 
       $('#rollinginfo').append('<br>' + data + ',key=' + lskey); 
       localStorage.removeItem(this.local_lskey); // Remove the relevant localStorage entry 
      } 
     , error: function (data) { $('#rollinginfo').append('<br />ERR:' + data); } 
     }); 
    } 
} 

这应该有效。

Answer 2

您是否考虑链接AJAX调用？基本上你可以做一个AJAX调用，处理结果，修改lskey等。然后当你准备好时，增加i并发出第二个AJAX调用。循环这种方式，而不是使用for循环...

Answer 3

最后，我将密钥信息添加到服务器发布，然后从服务器以JSON格式返回它，以便成功函数然后可以简单地引用密钥包含在服务器响应中。

Answer 4

你可以把你的Ajax调用到它自己的功能和传递lskey和postData值。这样localStorage.removeItem(lskey)将参照lskey变量函数的背景下，而不是在循环的情况下。

例

声明函数 -

function postForm(postdata, lskey) { 
    $.ajax({ 
    type: "POST", 
    async: "false", 
    url: "/Profile/PostForm", 
    data: postdata, 
    success: function(data) { 
     $('#rollinginfo').append('<br>' + data + ',key=' + lskey); 
     localStorage.removeItem(lskey); // Remove the relevant localStorage entry 
    }, 
    error: function(data) { 
     $('#rollinginfo').append('<br />ERR:' + data); 
    } 
    }); 
} 

然后你可以从你的循环中调用函数 -

for (var i = 0, len = localStorage.length; i < len; i++) { 
    var lskey = localStorage.key(i); 
    if (lskey.substr(0, 4) === 'form') { 
    var postdata = localStorage.getItem(lskey); // Get the form data 
    postForm(postdata, lskey); 
    } 
} 

你也可以只在循环之前声明函数（分配给变量），然后在循环中调用它。

var postForm = function(postdata, lskey) { 
    $.ajax({ 
    type: "POST", 
    async: "false", 
    url: "/Profile/PostForm", 
    data: postdata, 
    success: function(data) { 
     $('#rollinginfo').append('<br>' + data + ',key=' + lskey); 
     localStorage.removeItem(lskey); // Remove the relevant localStorage entry 
    }, 
    error: function(data) { 
     $('#rollinginfo').append('<br />ERR:' + data); 
    } 
    }); 
} 
for (var i = 0, len = localStorage.length; i < len; i++) { 
    var lskey = localStorage.key(i); 
    if (lskey.substr(0, 4) === 'form') { 
    var postdata = localStorage.getItem(lskey); // Get the form data 
    postForm(postdata, lskey); 
    } 
}