Question

这是我的函数getState，它调用ajax：

var getState = function(_id, callback) {
    $.ajax({
        url: hostGlobal+"site/estrutura/ajax.php",
        type: "POST",
        dataType: "HTML",
        data: {
            action: "getState",
            id: _id
        },
        success:function(result, textStatus, jqXHR) {
            callback(result);
        },
        error: function(jqXHR, textStatus, errorThrown) { 
        }
    });
}

在这里，我使用结果字符串进行连接：

"<li class='list-group-item listItem' id='state" + i + "'><strong>Estado:</strong><span class='listSpan'> " + getState(result[i]["estado"], function(x) { return x; }) + "</span></li>" +

由于返回语句不起作用，因为它返回匿名函数而不是getState，我尝试修改元素的内容：

... + "<li class='list-group-item listItem' id='state" + i + "'><strong>Estado:</strong><span class='listSpan'> " + getState(result[i]["estado"], function(x) { $("#state" + i).html(x); }) + "</span></li>" + ...

但是＆＃34; undefined＆＃34;是我得到的一切。我知道我没有正确使用回调，但我没有理解如何...

Answer 1

您想要连接本地计算机内存中尚未包含的字符串。您需要做的是创建一个回调，一旦http请求完成，它将向ul添加一个li元素。

这里有一些伪代码供你使用

var getState = function(_id, callback) {
    $.ajax({
        url: hostGlobal+"site/estrutura/ajax.php",
        type: "POST",
        dataType: "HTML",
        data: {
            action: "getState",
            id: _id
        },
        success:callback,
        error: function(jqXHR, textStatus, errorThrown) {
            console.log("Oh nooooo, there was an error.");
        }
    });
};

var ul = document.getElementById("ulToPopulate");

// Use some closure voodoo
function addLi(ulElement){
    return function(id, i){
        var li = new HTMLLiElement();
        // Initialize LI element here.
        li.classList.add("list-group-item");
        li.classList.add("listItem");

        // Make ajax request
        getState(id, function(result){
            // When the ajax request completes this callback will be called and the li will get added to the ul.
            li.setAttribute("id", "state"+i);
            li.innerHTML = "<strong>Estado:</strong><span class='listSpan'> " + result.toString() + "</span>";
            ulElement.appendChild(li);
        });
    }
}

// Make a function to add lis to the specified ul
var addLiToUlToPopulate = addLi(ul);

for(var i = 0, len = result.length; i<len; i++) // in your original code it looks like you were enumerating through an array called result for ids.
    addLiToUlToPopulate(/* ID */ result[i]["estado"], /* index (You appear to be using it in your li element) */ i);

旁注，为了优化目的，最好一次性向服务器发送一堆ID，这样你只能发出1个http请求。

如何返回异步串联请求的结果？

1 个答案: