将 For 循环变量传递到 AJAX 成功答案

【问题标题】：Passing For Loop Variable into AJAX Success将 For 循环变量传递到 AJAX 成功
【发布时间】：2017-04-24 10:17:49
【问题描述】：

我在将我的 for 循环索引变量传递给 ajax 成功函数时遇到问题。我知道这是重复的，但我已经尝试了其他几种我发现的解决方案，但似乎没有一个对我有用..

无论如何，我这里有这段代码：

embeds = document.getElementsByClassName('kcode');
for (i = 0, l = embeds.length; i < l; i++) {
    if (typeof embeds[i] != 'undefined' && typeof embeds[i].classList != 'undefined' && !embeds[i].classList.contains('filled')) {
        embeds[i].classList.add('filled');
        var embed = window.intext[embeds[i].getAttribute('data-k-kid')];
        if (embed) {
            embeds[i].classList.add('embed');
            switch (embed.type.toLowerCase()) {
                case 'sport_plugin':
                    if(sportData.selectedType.name == "Ranking Table") {
                        (function(i) {
                            jQuery.ajax({
                                url: url,
                                dataType: 'json',
                                success: function(response) {
                                    var content = '';
                                    if (table.name == "Western Conference" || table.name == "Eastern Conference") {
                                        content+= '</div>';
                                        embeds[i].innerHTML = content;
                                    }
                                }
                            });
                        })(i);
                    }
                break;
                default:
                embeds[i].style.display = "none";
            }
            embeds[i].classList.remove('kcode');
            i--;
        }
    }
}

现在，我要实现的目标 -

我想将 embeds 变量和 for 循环索引的 i 变量传递到我的 ajax 响应中，因此我可以在响应完成后设置 embeds[i] 的 innerhtml。我尝试包装 ajax function in (function (i) {})(i); 闭包，但它没有帮助。有任何想法吗？谢谢！

【问题讨论】：

标签： javascript jquery ajax variables scope

【解决方案1】：

我认为 i 变量在该范围内应该是全局的，所以我会尝试像这样使用它：

case 'sport_plugin':
                if(sportData.selectedType.name == "Ranking Table") {
                  jQuery.ajax({
                    url: url,
                    dataType: 'json',
                    success: function(response) {
                      var content = '';
                      if (table.name == "Western Conference" || table.name == "Eastern Conference") {
                        content+= '</div>';
                        embeds[i].innerHTML = content;
                      }
                    }
                  });
                }
            break;

【讨论】：

【解决方案2】：

您可以尝试为 ajax 创建回调成功函数。在ajax调用之前。像这样的

var successCallback = function() {
    var content = '';
    if (table.name == "Western Conference" || table.name == "Eastern Conference") {
        content+= '</div>';
        this.embeds[this.i].innerHTML = content;
    }
};

successCallback.i = i;
successCallback.embeds = embeds;

注意“这个”。在 i 前面。然后是你的 ajax：

jQuery.ajax({
    url: url,
    dataType: 'json',
    success: successCallback
});

我没有尝试过，但它可能会起作用

【讨论】：

您好，感谢您的回复，不幸的是它并没有解决我的问题。我仍然收到“无法为未定义设置 innerhtml”..
然后尝试同样的嵌入概念。 successCallback.embeds = 嵌入。然后在回调函数中 this.embeds[this.i].innerHTML = content

【解决方案3】：

我自己解决了这个问题，但感谢所有帮助和回复！

我只是使用这个函数来获取我的数据，而不是通常的 ajax 响应..

_get = {

'sync': function (url) {
    var xhr = typeof XDomainRequest != 'undefined' ? new XDomainRequest() : new XMLHttpRequest();
    xhr.open('get', url, false);
    xhr.send(null);
    console.log('sync url ' + url);
    //console.log(xhr.responseText); return {};
    var data = {};
    if (xhr.status == 200) {
        data = JSON.parse(xhr.responseText);
    }
    return data;
}
};

然后就

var response = _lr.get.sync(url);

【讨论】：