目前我的工作我的第一次的jQuery / AJAX调用和我在遇到如何将服务器端的结果填充到我的列表框的问题。弹簧控制器返回我的数据正确（希望）我只是有jQuery的部分与填充列表框的问题。

Currently I am working on my first jquery/ajax call and I'm having issues with how to populate the server side results into my listbox. The spring controller returns me the data correctly (hopefully) i just have issues with the jquery part with filling the listbox.

这是我的ajax调用

    $(function() {
     $projectKey = $('#projectKey');

    $projectKey.change (
        function() {
            $.ajax({
                type: "GET",
                url: "getVersionsByProjectKey",
                data: {"projectKey": $projectKey.val() },
                dataType: 'json',
                success: function(data){
                     alert('success');
                     alert(data);
                     $('#jiraVersion').append(
                             $('<option></option>').html(data)
                         );
                }
            });
        }
    );
});

这是我的控制器是这样的：

@RequestMapping(value="/getVersionsByProjectKey", method = RequestMethod.GET)
  public @ResponseBody List<String> getVersionsByProjectKey(@RequestParam(value = "projectKey") String projectKey) {  

        List<String> versions = new ArrayList<String>();
        versions.add("Chuck");
        versions.add("Norris");
        versions.add("John");
        versions.add("Doe");

        return versions;  
    }

这是我要填写数据的列表框：

This is the listbox that I want to fill the data in:

<td>
<form:select path="jiraVersion" id="jiraVersion">

</form:select>
</td>

正如我以前说过，我只是我自己熟悉的jQuery的现在，并试图一对夫妇从谷歌，但没有喜悦的解决方案。我想：

As I said before, I am just familiarizing myself with the jquery now and tried a couple of solutions from google but no joy. I tried:

success: function(data){
         alert('success');
         alert(data);
         $.each(data, function(index, item) {
         $("#jiraVersion").get(0).options[$("#jiraVersion").get(0).options.length] =    
         new Option(item.Display, item.Value);
       });}

等等等等

警报（'成功'）写信给我：查，诺里斯，约翰，李四。

The alert('success') writes me: Chuck,Norris,John,Doe.

如果我直接发送请求 / getVersionsByProjectKey？projectKey = AIL

我找回了 [查克，诺里斯，约翰，李四]

和我也尝试修改成功有：

success: function(data){
     alert('success');
     alert(data);
     $('#jiraVersion').append(
        $('<option></option>').html(data)
     );

 }

然后我的列表框只包含一个选项，这是的 ChuckNorrisJohnDoe 的。知不知道我做错了什么？

Then my listbox contains just one option which is ChuckNorrisJohnDoe . Any idea what I am doing wrong?

推荐答案

随着数据从Ajax调用是数组 [查克 ，诺里斯，约翰，李四] ，你需要遍历它使用的 jQuery.each（） ：

As the data from the Ajax call is the array ["Chuck","Norris","John","Doe"], you need to iterate through it using jQuery.each():

使用此功能为成功：

success: function(data){
    $.each(data, function(index, value) {
        $('#jiraVersion').append($('<option>').text(value).val(index));
    });
}

这将追加/生成：

<form:select path="jiraVersion" id="jiraVersion">
    <option value="0">Chuck</option>
    <option value="1">Norris</option>
    <option value="2">John</option>
    <option value="3">Doe</option>
</form:select>