javascript - 如何将此 JSON 响应放入下拉列表中

Question

我正在尝试将从服务器返回的这些数据放入下拉列表中，但不知道该怎么做，因为每个对象名称都以随机 ID 开头。这就是我在这里要做的:

 $("#CampaignOpenActionSubscriber_campaign_id").change(function() {
   var el = $(this);

   $.ajax({
     type: 'POST',
     url: "Dropdownlist",
     data: 'csrf_token=' + $('meta[name=csrf-token-value]').attr('content') +'&Selectedcampaign_id=' + el.val(),
     success: function (response) {
       var jsonResponse = $.parseJSON(response);
       for(var i=0; i< jsonResponse.length; i++){
         $("#selectCourse").append(
           $('<option>').text(jsonResponse[i]).val(jsonResponse[i])
         );               
       }
     }
   });
 });

这就是我从 JSON 响应中得到的...:

 {288878: "FOO", 288881: "BAZZ", 288882: "YOLLO"}

我如何将其放入下拉列表中？

Answer 1

要实现这一点，您需要使用 for..in 循环来遍历从 AJAX 调用返回的对象的键。试试这个:

var jsonResponse = {
  288878: "FOO",
  288881: "BAZZ",
  288882: "YOLLO"
}

var html = '';
for (var key in jsonResponse) {
  html += '<option value="' + key + '">' + jsonResponse[key] + '</option>';
}
$("#selectCourse").append(html);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="selectCourse"></select>

另请注意，JSON.parse() 在您的 AJAX success 处理程序中是多余的，因为 jQuery 会在检测到 JSON 时为您反序列化响应。如果这不会自动发生，您可能只需要将 dataType: 'json' 添加到选项中。