0

我想用 ajax 获取的数据填充一个选择框。

初始 HTML 代码如下所示:

<select id="myid" name="myname">
</select>

我需要避免innerHTML和其他类似的解决方法。我尝试使用appendChild,但似乎没有用。我对原型真的很陌生,所以我真的不知道该怎么做。

4

1 回答 1

1

假设您想将自创建对象的所有成员作为键值对添加到select元素中,您可以这样做:

var data = {
  a: 'Peter',
  b: 'Paul',
  c: 'Mary'
};

$('mySelect').update($H(data).map(function(o) {
  return '<option value="' + o.key + '">' + o.value + '</option>';
}).join(''));
​

您可以在此处找到它的 jsFiddle

代码背后的基本思想是option,通过将每个元素转换为字符串,从给定的数据对象创建元素。这是通过map方法完成的。

$H会将数据对象转换为 Prototype对象,这Hash在这里派上用场,因为它将{ key, value }对象传递给它的映射调用的第一个参数。

将所有元素转换为字符串后,您只需join通过一个空字符串(或您喜欢的任何非 HTML 代码,\n 也可以)将它们用于该update方法。

老实说,Element#update使用innerHTML所以这实际上不是一种解决方法。这只是一种方法。

于 2012-05-24T05:36:41.103 回答