从ajax添加后，下拉列表不会更新

Question

从AJAX加载selectlistitem到下拉列表时，它最初显示空白而不是选项。我不确定这是否是IE的限制，但在Firefox上是否可以正常使用。

我尝试在添加后像这样触发更改

$(ddlUpdate).trigger('change', true);

和

在没有运气的情况下添加以下内容

$(ddlUpdate).trigger("chosen:updated");
$(ddlUpdate).trigger("liszt:updated");

以下是触发变更的方式

$('#ddlDistrictName').change(function () {
        getTerritory($('#ddlSalesOffice').val(), $(this).val(), $('#ddlTerritoryName'));});

function getTerritory(branch,area , ddlUpdate) {
    $.ajax({
        url: "/instSearch/GetTerritory",
        data: { branch: branch, area: area },
        dataType: "json",
        type: "GET",
        error: function () {
            alert(" An error occurred.");
        },
        success: function (data) {
            $(ddlUpdate).empty();
            $.each(data, function (i) {
                var optionhtml = '<option value="' +
                    data[i].Value + '">' + data[i].Text + '</option>';
                $(ddlUpdate).append(optionhtml);
                $(ddlUpdate).trigger("liszt:updated");
            });
        }
    });

}

数据是JsonResult返回的JSON

<HttpGet()>
     Public Function GetTerritory(ByVal branch As String, ByVal area As String) As JsonResult

    'サービスインスタンス
    Dim service As New InstSearchService(Me.ATOOLS)
    Dim ddl As IEnumerable(Of SelectListItem) = New List(Of SelectListItem)

    ddl = service.GetTerritory(branch, area)

    Return Json(ddl, JsonRequestBehavior.AllowGet)

End Function

查看DOM时，将显示更新的列表。但是，当单击下拉列表时，第一次单击时显示空白，而第二次单击时显示整个列表。

我想念什么？

Answer 1

似乎仅在IE中才发生这种情况。所以我要做的是用div包围下拉列表，清空div。并重新附加下拉列表。这样，它就可以在IE上正常工作。

 $('.ddlTerritoryHolder').empty();
 $(territoryDdl).append(blankOption).appendTo('.ddlTerritoryHolder');