在for循环后执行javascript

Question

我有一个for循环从子列表中的列表中获取数据以使用异步ajax请求在页面上构建html列表，但此工作正常，但我希望在列表生成后按字母顺序显示列表。我正在用JavaScript学习曲线，所以任何帮助表示赞赏。 onWebsLoaded函数完成后，我需要运行sortProjects函数。

function onWebsLoaded(sender, args) { 
    for (var i = 0; i < this.webs.get_count(); i++) 
    { 
     client = ""; 
     var title = this.webs.itemAt(i).get_title(); 
     var desc = this.webs.itemAt(i).get_description(); 
     var url = this.webs.itemAt(i).get_serverRelativeUrl(); 
     id = (title).replace(/\ /g, ""); 
     getProjectProperties(url, title, desc, client, id); 
    } 
} 
function sortProjects() { 
    tinysort('ul#projectstable>li'); 
} 
function getProjectProperties (url, title, desc, client, id) { 
    $.ajax({ 
     url: url + "/_api/web/lists/getbytitle('Project Properties')/items('1')", 
     method: "GET", 
     headers: { "Accept": "application/json; odata=verbose" }, 
     success: function (data) { 
        client = data.d.Title; 
        $('#projectstable').append("<li id='" + id + "' class='ms-ListItem'><a href='" + url + "'><span id='" + id + "Client' class='ms-ListItem-primaryText'>" + title + "</span><span class='ms-ListItem-secondaryText'>" + client + "</span><span class='ms-ListItem-tertiaryText'>" + desc + "</span></a></li>"); 
     }, 
     error: function() { 
        $('#projectstable').append("<li id='" + id + "' class='ms-ListItem'><a href='" + url + "'><span id='" + id + "Client' class='ms-ListItem-primaryText'>" + title + "</span><span class='ms-ListItem-secondaryText'>" + client + "</span><span class='ms-ListItem-tertiaryText'>" + desc + "</span></a></li>"); 
     } 
    }); 
} 

Answer 1

，让你存储从$.ajax()调用返回的承诺的数组你可以修改你的逻辑。然后您可以将apply()排列为$.when并致电sortProjects()。试试这个：

function onWebsLoaded(sender, args) { 
    var requests = []; 
    for (var i = 0; i < this.webs.get_count(); i++) { 
     client = ""; 
     var title = this.webs.itemAt(i).get_title(); 
     var desc = this.webs.itemAt(i).get_description(); 
     var url = this.webs.itemAt(i).get_serverRelativeUrl(); 
     id = (title).replace(/\ /g, ""); 
     requests.push(getProjectProperties(url, title, desc, client, id)); 
    } 
    $.when.apply($, requests).done(sortProjects); 
} 

function sortProjects() { 
    tinysort('ul#projectstable>li'); 
} 

function getProjectProperties (url, title, desc, client, id) { 
    // note 'return' below 
    return $.ajax({ 
     url: url + "/_api/web/lists/getbytitle('Project Properties')/items('1')", 
     method: "GET", 
     headers: { "Accept": "application/json; odata=verbose" }, 
     success: function (data) { 
      client = data.d.Title; 
      $('#projectstable').append("<li id='" + id + "' class='ms-ListItem'><a href='" + url + "'><span id='" + id + "Client' class='ms-ListItem-primaryText'>" + title + "</span><span class='ms-ListItem-secondaryText'>" + client + "</span><span class='ms-ListItem-tertiaryText'>" + desc + "</span></a></li>"); 
     }, 
     error: function() { 
      $('#projectstable').append("<li id='" + id + "' class='ms-ListItem'><a href='" + url + "'><span id='" + id + "Client' class='ms-ListItem-primaryText'>" + title + "</span><span class='ms-ListItem-secondaryText'>" + client + "</span><span class='ms-ListItem-tertiaryText'>" + desc + "</span></a></li>"); 
     } 
    }); 
}