HTML - MOOTOOLS- 添加选项以在 ie6 中选择框

Question

<select id="selectId">
 <option>Please select product ...</option>
</select>

我在firefox上试了试

$('selectId').innertHTML = '<option>Test test</option>'

但在 ie 上，它不起作用，如何通过字符串选项添加选项，如上面在 ie 中

Answer 1

改用Element 类：

new Element('option', {
    text: 'test option'
}).inject($('selectId'));​

示例：http://www.jsfiddle.net/EJH5b/

Answer 2

如果你打算使用 Mootools，那么你应该真正使用 Mootools 方法，而不是在它和 vanilla Javascript 之间切换。这样做的一个好处是 Mootools 已经在为您处理浏览器的不一致问题。因此，如果您忽略它的方法，您将不得不自己处理它们。

要以 Mootools 方式访问元素的属性，您可以在任何元素上使用 set 和 get 方法。美元 ($) 函数返回一个元素，因此您可以链式设置并获取该元素。

//returns selectId's HTML
var foo = $('selectId').get('html'); 

//Sets the HTML of selectId to <option>Test test</option>
$('selectId').set('html', '<option>Test test</option>'); //

在这种情况下，你只需要使用 set。

您应该注意的一件事是，它不会向选择框添加选项，而是将选择框内的所有内容替换为选项。因此，如果您想使用它向选择框添加多个选项，则它不会起作用，因为您每次都在重置 HTML。拥有一个只有一个选项的选择框没有多大意义，所以我假设您正在尝试附加一个选项，而不是用一个选项替换所有内容。在这种情况下，请执行以下操作：

//get the current options selectId's options
var options = $('selectId').get('html'); 

//Add your own option onto the end
options = options + '<option>Test test</option>';

//Set the HTML of selectId to whatever is stored in options
$('selectId').set('html', options);