Question

嘿，不确定我是否正确地走这条路。我有两个不同的选择盒装。需要发生的是当选择框1中的某个项时，框2中的某些项被隐藏。我在FF中工作得很好但在IE中却没有...想法？

<div>  
    <label class="form_label">Apparel</label>  
    <select id="Choices" size="1" style="clear: right;" onchange"changeThis();">  
        <option value="select">Pick Your Product</option>  
        <option value="1">choice 1</option>  
        <option value="2">choice 2/option>  
        <option value="3">choice 3</option>  
    </select>
</div>
<div>
    <label class="form_label">Size</label>
    <select id="Sizes" size="1" style="clear: right;">
        <option value="select">Choose Your Size</option>
        <option value="SC">Small Child</option>
        <option value="IC">Intermediate Child</option>
        <option value="MC">Medium Child</option>
    </select>
</div>

...

function changeThing（choice）

{
    var item = document.getElementById("Choices");
    var size = document.getElementById("Sizes");
    var selitem = item.options[item.selectedIndex].value;

    if(selitem == '2546')
    {
        for(i=0; i<2; i++)
        {
            size[i].style.display = 'none';
            //alert(size[i]);
        }
    }

Answer 1

请尝试使用此代码：

http://www.w3schools.com/CSS/pr_class_visibility.asp

它会出现：

size[i].style.visibility='hidden';

修改

哦，欢迎来到StackOverflow！

Answer 2

前几天我遇到了同样的问题。 IE不允许使用visible：hidden或display：none作为选项元素。

您可以解决在变量中存储select1选项的问题。此变量将包含所有可能的值，因此当select1的值更改时，您可以删除select2的所有值，然后从变量中获取所需的选项以放入select2。

总结：

将所有可能的值存储在变量中
更改select1后，请删除select2的所有选项
过滤所需的选项（从步骤1的变量中获取这些值）并将其放入select2

Answer 3

您无法显示：无删除将完全删除它，如果您希望用户不选择使用已禁用。你可以做这样的事情

function changeThing()
{
var item = document.getElementById("Choices");
var size = document.getElementById("Sizes");
var selitem = item.options[item.selectedIndex].value;

if(selitem == '3')
{
    for(i=1; i<2; i++) // filter logic here
    {
        size[i].disabled = true; //false - to reset
        //alert(size[i]);
    }
}
size.selectedIndex = 0; // reset the selection so a disabled item may not be selected. }

Answer 4

这取决于你如何触发调用changeThing（）函数的事件。不确定IE9，但IE8和背面有onChange事件的问题。它基本上避免了它在IE中。你必须使用onClick。

如果您使用jQuery触发事件，onchange事件应该在所有浏览器（甚至IE）中正常工作。不确定其他Javascript库是如何做到的。

Answer 5

您需要完全删除此选项才能使其在IE中正常运行。

size.remove(i);

因此，您需要将选项存储在数组中，并在需要时将其加载回来。

Javascript隐藏选择框元素在IE中不起作用

5 个答案: