在每个AJAX请求中填充的组合框中选择项目

Question

我有以下JavaScript / jQuery问题：

1. 通过调用Web服务
在客户端填充Combobox
2. 在填充后的组合框中选择一个项目

我无法发布整个代码，但试图删除有趣的部分：

HTML：

<select name="RegionId">
</select>

JavaScript的：

$(function () {
     $.getJSON('/hotels/GetRegionsByCountry/1', function (data) {
         var items = [];
         $.each(data, function (index) {
             items.push('<option value="' + this.Id + '">' + this.Name + '</option>');
         });
         $("[name='RegionId']").html(items.join(''));
     });
     $("[name='RegionId']").val("24");
});

问题：填充组合框后（1）选择失败（2）。

在我看来，jQuery无法访问已填充的项目。但为什么呢？

Answer 1

在填充之前执行为输入字段分配值（请求尚未完成）。 试试这个：

$(function () {
     $.getJSON('/hotels/GetRegionsByCountry/1', function (data) {
         var items = [];
         $.each(data, function (index) {
             items.push('<option value="' + this.Id + '">' + this.Name + '</option>');
         });
         $("[name='RegionId']").html(items.join(''));
         $("[name='RegionId']").val("24");
     });   
});

Answer 2

尝试这样做：

$(function () {
     $.getJSON('/hotels/GetRegionsByCountry/1', function (data) {
         var select = $("[name='RegionId']");
         $.each(data, function (index) {
             select.append('<option value="' + this.Id + '">' + this.Name + '</option>');
         });
         $("[name='RegionId']").val("24");
     });

});