如何從JSON填充下拉項目？

Question

我有一個select元素，我想從javascript中添加選擇選項。我有一個ajax方法，這個方法返回JSON對象;

"{"serverTypes":["WINDOWS","LINUX"]}" 

我想添加這個JSON的選項。有沒有辦法做到這一點？

<select id="serverTypes" name="serverType" class="form-control"></select> 

編輯：
設置值不工作

$('#serverTypes').val(jsonData); 

Answer 1

你可以通過JSON和append()值循環：

var json = { 
 
    "serverTypes": ["WINDOWS", "LINUX"] 
 
}; 
 
for (var x = 0; x < json.serverTypes.length; x++) { 
 
    var option = json.serverTypes[x]; 
 
    $('#serverTypes').append('<option value="' + option + '">' + option + '</option>') 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<select id="serverTypes" name="serverType" class="form-control"></select>

Answer 2

var data = {"serverTypes":["WINDOWS","LINUX"]}; 
 
var serverTypes = data.serverTypes; 
 

 
var option; 
 
for (var i in serverTypes) { 
 
    if (serverTypes.hasOwnProperty(i) && i!="length"){ 
 
     option = $('<option></option>'); 
 
     option.val(serverTypes[i]); 
 
     option.text(serverTypes[i]); 
 

 
     $("#serverTypes").append(option); 
 
    } 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<select id="serverTypes" name="serverType" class="form-control"></select>