Question

我有这个功能

function Overlap() {
setTimeout(function() {
    $(".overlap").each(function(index, object) {
        var image = $(this).prev().attr('src');
        target = $(object);
        var xmlhttp
        xmlhttp = new XMLHttpRequest();
        xmlhttp.onreadystatechange = function() {
            if(xmlhttp.status == 200 && xmlhttp.readyState == 4) {
                xresponse = xmlhttp.responseText.split('-');
                $(target).children('a').attr('href', xresponse[0]);
                $(target).children('.name').html(xresponse[1]); //Set returned array appropriately
                $(target).children('.age').html(xresponse[2]);
                $(target).children('.specialization').html(xresponse[3]);
            }
        }
        xmlhttp.open('POST', 'factory/operational.php', true);
        xmlhttp.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
        xmlhttp.send('overlap=overlap&image=' + image);
    });
}, 1000);

}

HTML：

<div class="Divbox" id="Box_three"><img src='<?php ?>' />
    <div class="overlap">
        <a href='' class='name'></a>
        <div class='age'></div>
        <div class='specialization'></div>
    </div>
</div>

这是由

调用的

window.onload = Overlap();

从使用它的页面问题是功能有效..它通常被称为正确，我把它 window.onload＆amp; setTimeout功能可确保在尝试抓取.overlap元素之前页面完全加载。现在错误的是当调用重叠时，页面上有大约48个.overlap div元素，并且它们都将此请求发送到operational.php页面，但是在返回时它们不合适，它们只适用于从operational.php返回的最后一个元素，有人可以帮助我找到正确的选择器实例来传递以确保重叠的每个实例并且是儿童接收响应

Answer 1

你错过了宣布你的目标变量，使其成为全球目标。

target = $(object);

应该是

var target = $(object);

没有var，循环的每次迭代都将使用相同的target，这意味着所有xhr请求完整回调都将使用相同的目标。

示例：

$.each(["a","b","c"], function(i,val) {
    x = val;
    console.log(x); // "a", "b", "c"
});
console.log(x); //"c"

在每个完成后，x将是一个包含上次迭代值的全局变量。在您的代码中，您在每次迭代时都会执行异步操作，这意味着每个操作的回调都将在之后完成，这就是为什么target指向所有回调的最后一次迭代。

Javascript .each函数异常

1 个答案: