隐藏选择元素中的选项，不在IE中工作？

可能重复：
Hide select option in IE using jQuery 隐藏选择元素中的选项，不在IE中工作？

因此，大家可以看到下面，我有两个选择元素。第一个有两个值，1.4和1.7。取决于选择哪个选项，我想禁用第二个select元素中的某些选项。它在Chrome中运行得非常好，但IE仍然是个婊子（像往常一样！）。

任何想法有什么不对？

<p> 
    <label style="width: 155px; display: inline-block;">Height</label> 
    <select name="height"> 
     <option value="1.4">1.4</option> 
     <option value="1.7">1.7</option> 
    </select> 
</p> 
<p> 
    <label style="width: 155px; display: inline-block;">Amount</label> 
    <select name="slanor"> 
     <option class="four" value="2">2</option> 
     <option class="four seven" value="3">3</option> 
     <option class="seven" value="4">4</option> 
    </select> 
</p> 


<script> 
$(document).ready(function() { 
    check(); 

    $('select[name=height]').change(function() { 
     check(); 
    }); 

    function check() { 
     var slanor = $('select[name=slanor]'); 
     var currHeight = $('select[name=height]').val(); 

     if(currHeight == '1.4') { 
      slanor.find('option').hide(); 
      slanor.find('.four').show(); 
     } else { 
      slanor.find('option').hide(); 
      slanor.find('.seven').show(); 
     } 
    } 
}); 
</script>

来源

2011-11-17 qwerty

什么不起作用？它是否为高度获得正确的价值？（运行'console.log（currHeight）'找出。） – lonesomeday

请停止标记您的标题。你已经在这里差不多两年了！ –

隐藏options的在select的概念不存在IE。您将不得不手动删除并重新添加条目，这可能会带来一些不便。

另一种解决方案是还可以禁用的元素：

slanor.find(option).hide().prop('disabled', true);

这将隐藏在支持它的所有浏览器的选项，但在IE中禁用它，这意味着它仍然是可见的，但视觉区别于其他选项，并且不可选。

然而：如果你的问题是完全按照你的描述，也有只有两个选择，你的脚本将上有所不同，最简单的解决办法可能是hide和show两个不同的下拉菜单完全取决于哪个选项选择。

来源

2011-11-17 15:26:14

嗯，是的，工作。我试图将其设置为禁用，但它似乎不适用于IE 7/6。我想至少支持IE 7.我想剩下的唯一选择是有两个选择框。谢谢！ – qwerty

在jQuery中调用.hide（）将display：none添加到元素中。我怀疑这是标准的HTML，你可以用这种方式隐藏选项。

您可以使用此代码来代替：

slanor.empty(); 
if (currHeight == '1.4') { 
    slanor.append($('<option'>).val('2').text('2')); 
    slanor.append($('<option'>).val('3').text('3')); 
} 
else { 
    slanor.append($('<option'>).val('3').text('3')); 
    slanor.append($('<option'>).val('4').text('4')); 
}

来源

2011-11-17 15:29:49

您可以在此帖子中找到想要的答案： - http://stackoverflow.com/questions/29690181/how-to-disable-hide-select-options-using-css-in-ie/29690622#29690622 – Nitesh

选项标签不支持CSS的显示属性。 show（）/ hide（）是做什么的。您最好的选择是根据需要删除并重新创建选项。或者我想你可以将它们追加到另一个隐藏的物体上，并在需要它们完全成形时将其拉回。

所以，你会碰到这样的

$("option").appendTo($("#myhiddenselect")); 
$(".four").appendTo($("#myvisibleselect"));

来源

2011-11-17 15:38:29 kaykayman

隐藏选择元素中的选项，不在IE中工作？

回答

相关问题