Question

我的主要问题是buildItem（data）返回＆＃39; undefined＆＃39;。我已经通过stackoverflow上的一些关于如何进行回调函数的链接，但我认为它因为我在这里经历了多个函数而变得有点混乱。

我有一个我在此ajax电话中附加的列表。

<header>
    <nav>
        <div class="row">
            <ul class="main-nav">
                <li><a href="#">About</a></li>
                <li><a href="#">About</a></li>
                <li><a href="#">About</a></li>
                <li><a href="#">About</a></li>
                <li><a href="#">About</a></li>
            </ul>
        </div>
    </nav>
</header>

* {
    margin: 0;
    padding: 0;
}    

.row {
    max-width: 1140px;
    margin: 0 auto;
}

header {
    background-image: url(img/01.jpg);
    background-size: cover;
    background-position: center;
    height: 100vh;
    background-attachment: fixed;
}

.main-nav {
    float: right;
    list-style: none;
    margin-top: 60px;
}

.main-nav li {
    display: inline-block;
    margin-left: 40px;
}

我将buildItem（）定义为：

$.ajax({
    dataType: "json,
    url: "/retrieveTeamView.do?managerEmail=${email}",
    cache: false,
    success: function (data, status) {
        $('#nestable ol').append(buildItem(data));
    });

所以buildItem所做的就是获取数据并将其传递给getTotalCost。

这里我的getTotalCost（）函数应该接受该项，因为它有一个属性＆＃34; email＆＃34;我需要url，它应该循环通过从ajax调用中检索的数据来返回totalCost。

function buildItem(item) {
    getTotalCost(item, function(totalCost) {
        html += "<span>" + totalCost + "</span>";
        return html;
    }
 }

我的理解是回调（totalCost）返回buildItem（）并成功返回总成本。根据我的理解，做警报（html）在警告对话框中给我一个正确的输出，但它没有成功附加在ajax函数中。难道我做错了什么？

注意：我删除了大量的细节以保持这个想法，但仍然保持代码保密，所以很抱歉，如果某些部分可能看起来不像他们使用过。

Answer 1

我认为这个问题与AJAX调用是异步的事实有关。因此，它可能会尝试在返回所有内容之前更新DOM。因此，您需要嵌套调用。你可以尝试这样的事情：

$.ajax({
    dataType: "json,
    url: "/retrieveTeamView.do?managerEmail=${email}",
    cache: false,
    success: function (data, status) {
        $.ajax({
            dataType: "json",
            url: "/retrieveUserUsage.do?email=" + data.email,
            success: function(data) {
                var totalCost = 0;
                for (var i = 0; i < data.length; i++) {
                    totalCost += parseFloat(data[i].cost);
                }
                $('#nestable ol').append("<span>" + totalCost + "</span>");             
            }
        }); 
    }
});

如何处理使用具有ajax请求的回调函数的ajax请求？

1 个答案: