我有以下下拉选择:
<select id="start" onchange="calcRoute();"></select>
我需要用从这种类型的 Javascript 数组中获得的值来填充它:
{"name":"Hotel1","address":"Bondi Beach","lat":"6.369869","lng":"80.042055","thumb_path":"img\/hotel1.jpg"},{"name":"Hotel2","address":"Coogee Beach","lat":"6.025822","lng":"80.305727","thumb_path":"img\/hotel2.jpg"},{"name":"Hotel3","address":"Cronulla Beach","lat":"6.691994","lng":"79.928771","thumb_path":"img\/hotel3.jpg"},{"name":"Hotel4","address":"Manly Beach","lat":"6.887130","lng":"80.093420","thumb_path":"img\/hotel4.jpg"},{"name":"Hotel5","address":"Maroubra Beach","lat":"7.362609","lng":"79.825005","thumb_path":"img\/hotel5.jpg"}
我尝试了以下方法,但它不起作用。
for (i = 0; i < locations.length; i++) {
$('#start select').append('<option value=' + locations[i]['name'] + '>' + locations[i]['name'] + '</option>');
alert("sdgsfg");
}
请提出修复建议。
最佳答案
选择器 $('#start select')
将选择 <select>
#start
内的元素不能用作 select
的 ID 的元素本身就是start
.要正确选择元素,请使用
$('#start') // or $('select#start')
最好不要乱用 HTML 字符串。您可以使用 Option 构造函数来创建新的选项元素。
var locations = [{"name":"Hotel1","address":"Bondi Beach","lat":"6.369869","lng":"80.042055","thumb_path":"img\/hotel1.jpg"},{"name":"Hotel2","address":"Coogee Beach","lat":"6.025822","lng":"80.305727","thumb_path":"img\/hotel2.jpg"},{"name":"Hotel3","address":"Cronulla Beach","lat":"6.691994","lng":"79.928771","thumb_path":"img\/hotel3.jpg"},{"name":"Hotel4","address":"Manly Beach","lat":"6.887130","lng":"80.093420","thumb_path":"img\/hotel4.jpg"},{"name":"Hotel5","address":"Maroubra Beach","lat":"7.362609","lng":"79.825005","thumb_path":"img\/hotel5.jpg"}]
var select = $('#start')[0];
locations.forEach(function(location) {
select.add(new Option(location.name, location.name));
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="start"></select>
关于javascript - 从 jquery 中的二维数组填充下拉列表,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33386551/