0

我想遍历一定数量的页面，并使用 ajax 调用向它们填充内容。问题是，当我将 ajax 调用放在迭代函数中时，javascript 的同步特性存在问题。在 ajax 调用完成之前，迭代已经继续。所以我做了一个解决方法，在 setTimeout 中进行 ajax 调用，效果很好。但我不太喜欢这种方法，想知道是否有替代（更好的）解决方案。（我知道 jQuery 提供了一个 async: true 选项，但是这不起作用）

function populatePages(i) {
    pageId = PageIds[i];
    containerId = pageIdContainer[i];
    $j.ajax({
        type: 'GET',
        dataType: 'html',
        url: url,
        data: { pageid: pageId, containerid: containerId },
        success: function(data) {
           //populate the DIV
        }
    });
} 


i = 0;
x = 50;
$j.each(pagesIds, function(){  
    setTimeout("populatePages("+i+")", x);
    x = x + 50;
    i++;  
});
4

1 回答 1

0

试试这个（未测试）

function populatePages(i) {
    console.log('populatePages', i)
    pageId = PageIds[i];
    return $.ajax({
        type: 'GET',
        dataType: 'html',
        url: '/echo/html',
        data: { pageid: pageId},
        success: function(data) {
        }
    });
} 


function messy(index){
    console.log('messy', index)
    if(index >= PageIds.length){
        return;
    }

    populatePages(index).always(function(){
        console.log('complete', index)
        setTimeout(function(){
            messy(index + 1)
        });//to prevent possible stackoverflow
    })
}

PoC：小提琴

于 2013-05-13T10:36:34.247 回答