ajax请求不断返回最后一个请求

时间:2017-08-11 15:44:20

标签: javascript php xmlhttprequest

我正在尝试让ajax返回内部图库的图像。我让它返回我想要的图像,唯一的问题是返回的图像是后面的一个请求。

E.g。如果我调用return_img("test", 1, 5)没有返回图像,但是当我调用return_img("test", 6, 10)图像1到5时,将返回测试相册。

我的javascript代码

function return_img(album, start, end) {
    vars = "album" + album + "&start=" + start + "&end=" + end;
    _("out").innerHTML = "";

    var request = new XMLHttpRequest();
    request.open("POST", "gallery_return_img.php", true);
    request.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
    request.onreadystatechange = function () {
        if (request.readyState === 4 && request.status === 200) {
            var returned = request.responseText;
            returned = JSON.parse(returned);
            for (i = 0; i < Object.keys(returned).length; i++) {
                x = document.createElement("div");
                y = document.createElement("img");
                y.setAttribute("src", returned[i].url);
                x.appendChild(y);
                document.getElementById("out").appendChild(x);
            }
        }
    };
    request.send(vars);
}

我的PHP代码

if (key_exists('album', $_POST) && key_exists('start', $_POST) && key_exists('end', $_POST)) {
    $album = $_POST['album'];
    $start = $_POST['start'];
    $end = $_POST['end'];
    $render = json_decode(file_get_contents("/gallery_images/$album/info.pics"));
    $total = count($render);
    if($end > $total){
        $end = $total;
    }
    $pictures = [];
    for($start; $start <= $end; $start++) {
        array_push($pictures, $render[$start]);
    }
}

info.pics文件包含一个JSON编码的URL列表,以及需要在该专辑中呈现图像的图像名称。

1 个答案:

答案 0 :(得分:-1)

重读XMLHttpRequest()语法后,有一半人偶然发现了这个问题。

异步设置为true。

request.open("POST", "gallery_return_img.php", true);

我将其设置为false并且没有问题。

request.open("POST", "gallery_return_img.php", false);

不太明白为什么这会产生影响但是有效。