Question

{"BD": "Bangladesh", "BE": "Belgium", "BF": "Burkina Faso", "BG": "Bulgaria"}

如何使用javascript在html的选择框中将此数据显示为选项？

Answer 1

如果您使用Javascript，这非常简单。这样做，

＆＃13;

var countries = {"BD": "Bangladesh", "BE": "Belgium", "BF": "Burkina Faso", "BG": "Bulgaria"};
var selectHTML='';

for (var key in countries)
 {
     selectHTML +='<option value="'+key+'">'+countries[key]+'</option>';
 }
 
 document.getElementById('countries').innerHTML = selectHTML;

＆＃13;

<div id="select_box_wrapper">
  <select id="countries"></select>
</div>

＆＃13;

Answer 2

使用允许国家/地区的国家/地区对您的数组进行迭代，并将您的信息作为文本和值添加到您的选择下拉列表中。文本将是BE的缩写，值将是比利时。

Answer 3

这是一种在没有jQuery的情况下解决问题的方法，并且不附加HTML字符串。我使用Option构造函数在下拉菜单中创建一个选项，并将其插入select元素。

＆＃13;

var data = {"BD": "Bangladesh", "BE": "Belgium", "BF": "Burkina Faso", "BG": "Bulgaria"};

var selectControl = document.getElementById("countries");

for(var prop in data) {
  if(data.hasOwnProperty(prop)) {
    var option = new Option();
    option.text = data[prop];
    option.value = prop;
    selectControl.options[selectControl.options.length] = option;
  }
}

＆＃13;

<select id="countries">
</select>

＆＃13;

如何在选择框中显示json数据？

3 个答案: