如何在IE中动态更新HTML“选择”框

我有一个HTML select元素，我正在用如下代码动态更新它：

var selector = document.getElementById('selectorId');    
for (var i = 0; i < data.length; ++i)
{
  var opt = document.createElement('option');
  opt.value = data[i].id;
  opt.text = data[i].name;
  selector.appendChild(opt);
}

---

在Firefox中工作正常，但IE7不会调整列表框的大小以适应新数据。如果列表框最初是空的（在我的例子中是空的），您几乎看不到我添加的任何选项。有更好的方法吗？或者修补它以在IE中工作的方法？

您可以尝试从生成的html代码中替换整个select元素，或者作为黑客从DOM中删除元素并读取它。

您可以尝试从生成的html代码中替换整个select元素，或者从DOM中删除元素并读取。设置选项对象的innerHTML属性，而不是它们的文本

在IE6上工作，刚刚测试过。在FF3上不会中断，所以我猜就是这样

我选择innerHTML是因为它可以跨浏览器工作。要设置文本，您必须在IE上使用innerText，在FF上使用textContent，并且您可能还必须在其他地方测试它。只要名称属性中没有特殊字符&，innerHTML就足够了。

设置选项对象的innerHTML属性，而不是它们的文本

在IE6上工作，刚刚测试过。在FF3上不会中断，所以我猜就是这样

---

我选择innerHTML是因为它可以跨浏览器工作。要设置文本，您必须在IE上使用innerText，在FF上使用textContent，并且您可能还必须在其他地方测试它。只要名称属性中没有特殊字符&，innerHTML就足够了。

您不需要为此操作DOM。试试这个

var selector = document.getElementById('selectorId');  
for (var i = 0; i < data.length; ++i) {
    selector.options[selector.options.length] = new Option(data[i].name, data[i].id);
}

---

您不需要为此操作DOM。试试这个

var selector = document.getElementById('selectorId');  
for (var i = 0; i < data.length; ++i) {
    selector.options[selector.options.length] = new Option(data[i].name, data[i].id);
}

---

使用CSS“width”样式显式设置选择框的宽度，而不是让浏览器根据其内容猜测宽度。

使用CSS“width”样式显式设置选择框的宽度，而不是让浏览器根据其内容猜测宽度。

添加option元素后，强制将select.style.width设置为自动，即使它已经是自动的

如果这不起作用，请清除select.style.width to，然后再次将select.style.width恢复为自动

---

这将使Internet Explorer重新计算选定元素的最佳宽度。

添加选项元素后，强制将select.style.width设置为“自动”，即使它已经是“自动”

如果这不起作用，请清除select.style.width to，然后再次将select.style.width恢复为自动

---

这使得Internet Explorer重新计算所选元素的最佳宽度。

opt.text是返回Netscape SomethingAncent.0的每个JavaScript浏览器都支持的标准属性，对于特殊字符没有问题。innerHTML是一个非标准的IE扩展，尽管最近的浏览器都使用它。我不认为这真的是一场胜利。试试看，看看有什么不同。无论是否标准，它都能在主流浏览器中工作，并解决了特定的问题。我指出，你也可以用不同的方式来做。说到标准：我看到人们做和推荐令人难以置信的疯狂事情，以回避链接目标属性已经脱离标准这一事实。这并没有让他们的代码变得更好，只是让它对SGML解析器有效。text是返回Netscape SomethingAncent.0的每个JavaScript浏览器都支持的标准属性，对于特殊字符并没有问题。innerHTML是一个非标准的IE扩展，尽管最近的浏览器都使用它。我不认为这真的是一场胜利。试试看，看看有什么不同。无论是否标准，它都能在主流浏览器中工作，并解决了特定的问题。我指出，你也可以用不同的方式来做。说到标准：我看到人们做和推荐令人难以置信的疯狂事情，以回避链接目标属性已经脱离标准这一事实。这并没有让他们的代码变得更好，只是让它对SGML解析器有效。是的。那怎么不操纵DOM呢？：-但我必须承认，它工作得完美无缺+1我指的是document.createElement，它创建任意元素，您稍后将这些元素插入DOM appendChild。无论如何，有不同的方法可以解决这个特定的问题。那怎么不操纵DOM呢？：-但我必须承认，它工作得完美无缺+1我指的是document.createElement，它创建任意元素，您稍后将这些元素插入DOM appendChild。无论如何，对于这个特殊的问题有不同的解决方法。