Question

是的，这适用于FF和Chrome，但由于某种原因无法在IE 8中工作。我正在使用单选按钮来清除表单的某个部分..该部分是一个选择框，但我不想要将该区域留空 - 相反，我想将其重置为页面加载时的状态。目前IE8只是给我一个空的小选择框。

HTML：

<select id="city_select" disabled="true" name="location_id" onchange="show_search_button();"><option selected>Select your city</option> </select>

使用Javascript：

document.getElementById('city_select').innerHTML = "<option selected>Select your city</option>";

我也尝试在javascript中使用location_id而不是city_select，但无济于事.. innerText和innerContent也不起作用..尽管inner.HTML在IE8中用于早期函数，但是这并不是试图将innerHTML转换为表单。有谁知道为什么这适用于Chrome和FF而不是IE8？这有解决方案吗？任何帮助表示感谢！

Answer 1

试试这个：

document.getElementById('city_select').options.length = 0;

然后创建一个新选项并将其推送到select的options数组。选项是一个棘手的位，不像其他标记那样。

编辑以显示如何创建选项：

var sel = document.getElementById('city_select').options.length = 0;
var opt = document.createElement('option');
opt.value = "Select Your City";
sel.options.push(opt);
sel.selectedIndex = 0;

Answer 2

应该有4种方法为select元素分配新选项。有些在某些情况下工作，有些在其他情况下工作。看这里 - How to Add options to <SELECT>, in IE Windows Mobile 5

对我而言，Robusto的解决方案由于三个原因而无效：

1）第一行中的sel变量被赋予document.getElementById('city_select').options.length = 0;而不是简单地保持select元素（稍后在第4行和第5行使用），然后删除下一行中的选项，如下所示：

var sel = document.getElementById('city_select');
sel.options.length = 0;

2）第4行sel.options.push(opt)（或稍后建议的sel.options[0] = opt）抛出对象不支持此属性或方法错误。而是使用它：

sel.appendChild(opt);

3）除了为选项指定值之外，还必须指定要显示的文本。你这样做：

opt.innerText = "Select Your City - displayed";

因此，总结整篇文章：

var sel = document.getElementById('city_select');
sel.options.length = 0;
var opt = document.createElement('option');
opt.value = "Select Your City";
opt.innerText = "Select Your City - displayed";
sel.appendChild(opt);
sel.selectedIndex = 0;

InnerHTML IE 8无法正常工作？重置表单

2 个答案: