Question

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

初始HTML代码如下：

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

我需要避免innerHTML和其他此类变通办法。我尝试使用appendChild，但似乎没有用。我对原型很新，所以我真的不知道如何去做。

Answer 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 of it here。

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

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

将所有元素转换为字符串之后，您只需要join空字符串（或任何您喜欢的非HTML代码，\ n也可以这样做），以便能够将它们用于{ {1}}方法。

说实话，Element#update使用update，因此实际上并非解决方法。这只是一种方法。

使用Prototype-JS填充选择框的正确方法

1 个答案: