0

我有一些“ajax”调用（真的是 sjax，我猜你可以调用它），我试图让它们一次在页面上呈现，但它们不是。它们都在最后渲染。我怎样才能把它们隔开？

function getNames() {
    var names = $('#thenames').val();
    alert(names);
    var splitnames = names.split(',');
    for(var i = 0; i < splitnames.length; i++) {
    var name = splitnames[i];

    $.ajax({
        type: 'GET',
        url: '/acert/secure/people/namesservice/getnamesajax.jsp',
        data: { usernames: name},
        success: function(data) { $('#results').html($('#results').html() + data);},
        async: false });
        }
    }
}

我不能冒险让它们以错误的顺序返回，所以我需要它们是同步的。我把它们放到一个for循环中，所以for循环应该让浏览器有机会在调用之间进行渲染，但我似乎做不到。

关于我做错了什么的任何想法？

如果我在成功功能中添加一个警报框，它可以工作，但我不想照看操作，我只想不时监控它的进度。

4

4 回答 4

2

async: false 阻止浏览器。它完全锁定了所有内容，包括对 DOM 的重绘。

我强烈建议您不要使用async: false. 这是非常糟糕的。

您可能可以setTimeout在调用之间使用，但它们不能保证浏览器会触发重绘。

如果您设置async: true，您将不会遇到此问题，但您可能必须更改代码以正确处理异步行为。

async false 太糟糕了 jQuery 决定从 API 中删除它。

于 2013-02-28T16:20:08.047 回答
1

不要使用async: false.

下面的代码将尽可能快地运行所有 ajax 请求，然后以正确的顺序将内容附加到#results。async: false如果您使用下面的代码，请不要包括在内。

var defArr = [];

for(var i = 0; i < splitnames.length; i++) {
    defArr.push( $.ajax({...}) );
}

$.when.apply($,defArr).done(function(){
    var $results = $("#results");
    $results.empty();
    for (var i = 0; i < arguments.length; i++) {
        $results.append(arguments[i][0]);
    }
});
于 2013-02-28T16:24:56.383 回答
0

假设您知道您进行了多少次调用（或者可以将其作为返回结果的参数包含在内），您可以简单地异步触发调用，并将它们作为成功回调的数组中的元素。当数组达到预期大小时，只需按顺序渲染它们。

于 2013-02-28T16:19:32.797 回答
0

一方面，您似乎在那里有一个额外的花括号。

但更重要的是，如果您只是想监控进度，您可以使用它setTimeout吗？

- 更新 -

我想我明白你想要做什么。如果我没记错的话，你可以稍微重构一下，然后使用一个闭包和一个以名称作为键的对象。像这样的东西：

function getNames()
{
    var names = $('#thenames').val();
    var splitnames = names.split(',');
    var myData = {};


    for(var i = 0; i < splitnames.length; i++) 
    {
        (function(name) 
            { return function(){
            $.ajax({
                type: 'GET',
                url: '/acert/secure/people/namesservice/getnamesajax.jsp',
                data: { usernames: name},
                success: function(data) { myData[name] = data; updateNames(); }
            });

        })( splitnames[i] )
    }
}

这基本上所做的是它立即设置了一堆 ajax 调用，中间的那个奇怪的位与 (function(){})() 确保你最终不会name获取设置为的最后一个值当循环结束时。一切都保存到，我想一旦每个人都被加载，你可以检查你拥有的myData所有名字是否都在splitnames函数中。就像是myDataupdateNames

var count = 0; 
for ( var i = 0; i < splitnames.length; i++ ) 
{
    count += myData[splitnames[i]] != null ? 1 : 0; 
}

if (count == splitnames.length)
{
   // write the names to the screen
}

那有意义吗？

但是，老实说，最好的方法可能是更改 getnamesajax.jsp 以便它接受所有名称，然后按您需要的顺序返回您需要的信息。如果这是一种选择，那将是最好的，因为您只需要进行一次 ajax 调用。

于 2013-02-28T16:22:46.237 回答