IE8中下拉列表中显示/隐藏所选选项不起作用

Question

我正在尝试在下拉列表上执行显示/隐藏机制。这种情况是从下拉列表中选择值后，该值在第二个下拉列表中应不再可用。

该代码适用于Firefox，但不适用于IE8。这是代码

<select id="dropdownone" class="" name="dropdownone">
<option selected="selected" value="">Default</option>
<option value="1">question 1?</option>
<option value="2">question 2</option>
<option value="3">question 3</option>
</select>
<select id="dropdowntwo" class="" name="dropdowntwo">
<option selected="selected" value="">Default</option>
<option value="1">question 1?</option>
<option value="2">question 2</option>
<option value="3">question 3</option>
</select>
$("#dropdownone").bind('change', function () {
            var index = this.selectedIndex;
            if (this.value != "") {
                $("#dropdowntwo option").each(function () {
                    var disabled = (this.index == index);
                    //$(this).attr("hidden", disabled);
                    if (disabled ) {
                        $(this).css('visibility', 'hidden');
                    } else {
                        $(this).show();
                    }
                });
            }
        });

Answer 1

你可以试试：

$("#dropdownone").bind('change', function () {
var firstDropDown = this.selectedIndex;
if (this.value != "") {              
    $("#dropdowntwo option").each(function () {
        if(this.index == firstDropDown) {
            $("#dropdowntwo option[value='" + firstDropDown + "']").attr("style", "visibility: hidden;");
        } else {
            $("#dropdowntwo option[value !='" + firstDropDown + "']").attr("style", "visibility: show;");
        }
    });
}
});

我已经检查过这是否在IE8中工作。