Javascript DOM定时还是错误的代码？

我有两个多选列表框，第一个允许用户选择团队。 第二个显示与团队相关的成员。当选择团队的第一个列表框时，我会调用ajax来填充该团队的成员。我也在使用所选的库。这一切都很好，但是，我需要一种从listbox选定值中删除x的方法，这样用户就不会认为他们可以从团队中删除成员

$MainContent\u lbMembers\u选择a.removeclassearch-choice-close

当我在控制台窗口中抛出它时，上面的代码可以工作，但是如果我的if条件下有它，它似乎不工作：

$("#MainContent_lbTeams").on('change', function() {
            //was a value selected?
            var latest_value = $("option:selected:last", this).val();
            var latest_text = $("option:selected:last", this).text();

            if ($("#MainContent_lbTeams :selected").length > 0) {
                $("#dTeamNotice").show();
                $("#MainContent_lblTeamMembers").text("Members of '" + latest_text + "':");
                PopulateMembers(latest_value);
                $("#MainContent_lbMembers_chosen a").removeClass("search-choice-close");
                $("#trMembers").fadeIn();
            } else {
                //hide it...
                $("#dTeamNotice").css("display", "none");
                $("#trMembers").hide();
            }
        });

基本上，更改事件获取最近选择的文本和值。如果所选内容的长度>0，我将向团队成员加载PopulateMembers：

但我无法理解为什么在控制台窗口中我可以这样做：

$MainContent\u lbMembers\u选择a.removeclassearch-choice-close

它从所选值中删除x，这样用户就无法删除某个项目，但在if条件下，这不会产生任何效果

我甚至试过这样做：

$MainContent\lbMembers.attr'disabled'，true.triggerSelected:已更新

这只在控制台中起作用，是时间问题还是其他问题？

PopulateMembers包含一个异步Ajax调用。因此，如果您希望：

PopulateMembers(latest_value);
$("#MainContent_lbMembers_chosen a").removeClass("search-choice-close");

要在PopulateMembers中对ajax调用的结果进行操作，确实存在计时问题。Ajax调用将在将来的某个时间完成，在PopulateMembers完成之后以及在您执行.removeClass语句之后

要对PopulateMembers的结果进行操作，您必须将代码放入该ajax调用的成功处理程序中，或者重新构造代码，以便PopulateMembers在回调完成时调用回调，并且您可以在该回调中执行.removeClass

我建议使用这样的承诺：

// return the ajax promise from PopulateMembers
function PopulateMembers(buCompanyTeamID) {
     $('#<%=lbMembers.ClientID %>').empty().append('<option selected="selected" value="0">Loading...</option>');
     $("#<%=lbMembers.ClientID %>").trigger("chosen:updated");
     return $.ajax({
         type: "POST",
         url: "/Code/WebServices/Utilities.asmx/GetTeamMembers",
         data: '{buCompanyTeamID: ' + buCompanyTeamID + '}',
         contentType: "application/json; charset=utf-8",
         dataType: "json"
     }).then(onMembersPopulated, function (response) {
             alert(response.d);
     });
 }

 $("#MainContent_lbTeams").on('change', function() {
        //was a value selected?
        var latest_value = $("option:selected:last", this).val();
        var latest_text = $("option:selected:last", this).text();

        if ($("#MainContent_lbTeams :selected").length > 0) {
            $("#dTeamNotice").show();
            $("#MainContent_lblTeamMembers").text("Members of '" + latest_text + "':");
            // act only when the returned promise is resolved
            PopulateMembers(latest_value).then(function() {
                $("#MainContent_lbMembers_chosen a").removeClass("search-choice-close");
                $("#trMembers").fadeIn();
            });
        } else {
            //hide it...
            $("#dTeamNotice").css("display", "none");
            $("#trMembers").hide();
        }
    });

---

@JonH-我使用Promissions添加了一个建议的修复。现在我得到了PopulateMembers的未定义函数。@JonH-我答案中的拼写错误，修复了。您应该能够通过查看错误控制台来识别语法错误。

// return the ajax promise from PopulateMembers
function PopulateMembers(buCompanyTeamID) {
     $('#<%=lbMembers.ClientID %>').empty().append('<option selected="selected" value="0">Loading...</option>');
     $("#<%=lbMembers.ClientID %>").trigger("chosen:updated");
     return $.ajax({
         type: "POST",
         url: "/Code/WebServices/Utilities.asmx/GetTeamMembers",
         data: '{buCompanyTeamID: ' + buCompanyTeamID + '}',
         contentType: "application/json; charset=utf-8",
         dataType: "json"
     }).then(onMembersPopulated, function (response) {
             alert(response.d);
     });
 }

 $("#MainContent_lbTeams").on('change', function() {
        //was a value selected?
        var latest_value = $("option:selected:last", this).val();
        var latest_text = $("option:selected:last", this).text();

        if ($("#MainContent_lbTeams :selected").length > 0) {
            $("#dTeamNotice").show();
            $("#MainContent_lblTeamMembers").text("Members of '" + latest_text + "':");
            // act only when the returned promise is resolved
            PopulateMembers(latest_value).then(function() {
                $("#MainContent_lbMembers_chosen a").removeClass("search-choice-close");
                $("#trMembers").fadeIn();
            });
        } else {
            //hide it...
            $("#dTeamNotice").css("display", "none");
            $("#trMembers").hide();
        }
    });