javascript - 取消选择不允许多选的控件中的所有html选择选项

Question

我有一个包含多个 HTML Select 控件的网页，这些控件都允许进行多项选择。在每个控件旁边，我们有一个“清除”按钮，用于取消选择控件中所有选定的项目，onclick 看起来像这样:

<input type=button value="Clear" size=5 onclick="selectOptions('n.MyControl', false)">

调用的 Javascript 代码如下所示:

function selectOptions(controlName, bSelectItems)
{
    for (i=0; i < document.myForm[controlName].options.length; i++)
    {
        document.myForm[controlName].options[i].selected = bSelectItems;
    }

}

它与允许多选的 Select 控件一起工作得很好，但我只是添加了一个不允许多选的 Select 控件(即没有“multiple”属性)，这段代码没有清除它。如果我添加“多个”属性，“清除”按钮将再次开始工作，所以我知道这与我不允许选择多个项目这一事实有关。

我的问题是，为什么上面的代码不起作用，更重要的是，我怎样才能在 JavaScript 中清除我的新 Select 控件？

Answer 1

你的代码不起作用的原因是因为你试图遍历每个选项并做一些事情，但是因为(就像你说的)没有设置 multiple 属性，它不允许你修改 多个选项。

至于修复它，您可以尝试获取所选的选项，然后取消选择该单个选项。

更新:我不确定这是否是理想的解决方案，但它似乎适用于 IE8。

document.getElementById('myselect').selectedIndex = -1;

当然，您可以通过最适合您的方式获取 select 元素，但只需将 selectedIndex 属性设置为 -1。