我似乎可以弄清楚为什么我会收到语法错误。有任何想法吗？

Question

我们正在构建一个带有自动完成功能的动态SELECT框，以便在此链接上的标准选择之后建模：

http://harvesthq.github.io/chosen/

SELECT框未填充。

事实证明，该链接上的SELECT插件不支持Ajax本身。

现在，我正在尝试通过尝试每次添加选项时重新创建<options>...</options>来解决此问题。

但它仍然没有填充。

我在控制台中运行它，它在第96行显示语法错误：

).each(function(i, building) {
  $('<option>')
    .val(building.BuildingID)
    .text(building.BuildingDisplay)
    .appendTo($('#buildingID'));

有人可以试着看看你能找到我做错的事吗？

这是完整的（必要的）代码：

function getBuildings() {
  $.ajax({
    url: 'getBuildings.php',
    dataType: 'json'
  })
  .done(function(buildingInfo) {
   $(buildingInfo).replaceWith('<select name="buildingID" id="buildingID" style="width:600px;font-size:10pt;" class="changeable" data-summary="summBuilding"></select>')
      ).each(function(i, building) {
    $('<option>').val(building.BuildingID).text(building.BuildingDisplay).appendTo( $('#buildingID') );
   })

  $("#buildingID").choose();
  });
 }

SELECT框：

<div>
  <select name="buildingID" id="buildingID" data-placeholder="Choose a building..." class="chosen-select" style="width:500px;">
    <option value=""></option>
  </select>
</div>

提前感谢您的帮助

    function getBuildings() {
        $.ajax({
            url: 'getBuildings.php',
            dataType: 'json'
        })
  .done(function(buildingInfo) {
$(buildingInfo).replaceWith('<select name="buildingID" id="buildingID" style="width:600px;font-size:10pt;" class="changeable" data-summary="summBuilding"></select>')).each(function(i, building) {$('<option>').val(building.BuildingID).text(building.BuildingDisplay).appendTo( $('#buildingID')}) );
   })

  $("#buildingID").choose();
  });
 }

Answer 1

在发布SO之前，请先使用http://jshint.com/或http://jslint.com检测并查找更简单的语法（和样式）错误。

错误似乎是一个额外的括号：

.replaceWith('stuff')).each(function(i, building) {})

根据请求，这里是（语法合法的）更正代码：

function getBuildings() {
    $.ajax({
        url     : 'phpservices/getBuildings.php',
        dataType: 'json'
    }).done(function (buildingInfo) {
        $(buildingInfo)//wrap json in jquery
          .replaceWith('<select name="buildingID" id="buildingID" style="width:600px;font-size:10pt;" class="changeable" data-summary="summBuilding"></select>')//replace json with select which is never added to the dom
          .each(function (i, building) { //iterate the select ***NOT THE JSON BECAUSE YOU REPLACED IT***
              $('<option>')
                .val(building.BuildingID)
                .text(building.BuildingDisplay)
                .appendTo($('#buildingID'));
          });
          $("#buildingID").choose();
    });
}