javascript - 如何等待$ .getJSON()？

我在这个选择组上执行一个.each（）时遇到了这个问题，对于每个选择，它都会触发对服务器的调用，以填充一些数据。但是我不知道为什么它只会填充最底端的一个。然后我放入了一些alert（），并意识到它只在最后一次多次运行回调函数。我意识到，当完成第一个JSON调用时，$（this）有所不同...我如何等待它，以便通过正确的调用填充所有这些？

这是脚本部分：

var thisbundle;
var testcount = 0;

//get bundle options first..
$("select.bundle").each(function() {

  thisbundle = $(this);
  testcount++;
  var url = "/order/getpricing/" + thisbundle.attr("id");

  //clear it out...
  //thisbundle.children().remove();

  var passbundle = thisbundle;
  $.getJSON(url, function(data, passbundle) {
    var options = '';
    for (n = 0; n < data.length; n++) {
      options += '<option value="' + data[n].volumeID + '">' + explainPricing(data, n) + '</option>';

    }
    passbundle.html(options);
  });
});

这是表格的一部分：

<div id="bundles">
<table>
    <%foreach (KODmvc.Models.Product prod in Model.products)
      {%>
            <%if (prod.NumberOfCourses > 1)
              { %>
                <tr><td><img src="<%=prod.Icon %>" /></td><td><b><%=prod.Title%></b><br /><%=prod.Description%></td><td><select class="bundle" id="<%=prod.ProductID %>"><option value="-1">None</option>"</select></td></tr>
            <%} %>
    <%} %>
    </table>
</div>

最佳答案

在您的函数中而不是在全局范围中声明thisbundle：

$("select.bundle").each(function(){
    var thisbundle = $(this);
    // …
});

否则，全局对象将被回调函数随后使用的每次迭代覆盖。