javascript - jquery: .filter().css ("visibility", "collapse") 在 IE 中不工作，在 FF 中工作正常

Question

我有一个表格，其中有两个下拉菜单。 从第一个下拉列表中选择一个值后，将显示第二个下拉列表的值。

为此，我编写了以下函数，该函数在第一个下拉列表的 onchange 事件上被调用:

function dataTypeChanged(selectedValue){

document.getElementById("nodeInputValidation").innerHTML = "";
var rows = $('table.intValidationTable tr');
rows.filter('.rangeTR').css("visibility", "collapse");
rows.filter('.listTR').css("visibility", "collapse");
rows.filter('.textListTR').css("visibility", "collapse");
rows.filter('.dateRangeTR').css("visibility", "collapse");
rows.filter('.dateListTR').css("visibility", "collapse");

var validationTypes = document.getElementById("validationType").options;
document.getElementById("validationType").value = "";
var datatype;
for(var i=0;i<validationTypes.length;i++)
{
    datatype = validationTypes[i].value.substring(0,validationTypes[i].value.indexOf("_"));

    if(datatype != selectedValue){
        $("#validationType option[value=" + validationTypes[i].value + "]").hide();
    }else{
        $("#validationType option[value=" + validationTypes[i].value + "]").show();
    }
}
}

此功能在 Firefox 中运行良好。 但不知何故它在 IE 8.0 中不起作用。

编辑: 早些时候我认为这可能是它的原因。但事实并非如此。

var rows = $('table.intValidationTable tr');
rows.filter('.rangeTR').css("visibility", "collapse");
rows.filter('.listTR').css("visibility", "collapse");
rows.filter('.textListTR').css("visibility", "collapse");
rows.filter('.dateRangeTR').css("visibility", "collapse");
rows.filter('.dateListTR').css("visibility", "collapse");

好像是函数的另一部分。显示/隐藏第二个下拉选项的代码不起作用。当前正在显示所有选项。

你们能帮帮我吗。

如果需要更多代码，请告诉我。

Answer 1

No versions of Internet Explorer (including IE8) support the property values "inherit" or "collapse".

改用display:none;。

例如:

rows.filter('.rangeTR').css("display", "none");