如何从JSON哈希创建HTML选择选项？

我有一个简单的JSON代码：

[{'1':'Name'}, {'2', 'Age'}, {'3','Gender'}] 

我的HTML中有一个select标签：

我需要一种简单的方法来从这个JSON创建HTML选择框，如下所示：

  Name Age Gender  

Answer 1

只是为了踢这里是一个纯javascript的答案，你也可能不需要一个数组这只是一个简单的对象就足够了

Answer 2

试试这个。

 //Correct(missing colons) in the array items var data = [{'1':'Name'}, {'2': 'Age'}, {'3': 'Gender'}]; 

创建option元素，然后使用append方法将它们附加到select元素中。

 var $select = $('#datas'); $.each(data, function(i, val){ $select.append($('', { value: (i+1), text: val[i+1] })); }); 

演示

Answer 3

上面的答案假定数组的数据索引是有序的。 如果数据变量是：

 var data = [ {'23':'Age'}, {'12':'Gender'}, {'3':'Name'}]; 

所以按字母顺序排列，但随机ID为。

我在解决这个问题时找到的一种方法是：

 $.each(data, function(key, value) { var i = Object.keys(value)[0]; $("select#datas").append( $("").val(i).text(value[i]) );