Question

我有这样的下拉列表，

<div class="my_div">
    <select name="selection" id="select_id">
        <option value="0">A</option>
        <option value="5">B</option>
        <option value="6">C</option>
        <option value="7">D</option>
        <option value="8">D</option>
        <option value="9">F</option>
    </select>
</div>

我的链接看起来像这样，

<a class="links" href="#">Disable A C D</a>
<a class="links" href="#">Disable B E F</a>

我的脚本看起来像这样，

$(document).ready(function(){
    $('.links a').click(function(){
        var txt = $(this).text();       

        if( txt == 'Disable A C D'){
            $('div.my_div #select_id').find("option[value='0']").hide();
            $('div.my_div #select_id').find("option[value='6']").hide();
            $('div.my_div #select_id').find("option[value='7']").hide();
        }
    });
});

这适用于Firefox和Chrome，但只有禁用该选项才能在IE上运行，隐藏它无效。我错过了什么？干杯！

Answer 1

你选择链接是错误的。试试这个：

$('a.links')

这个小提琴适用于IE（至少9个）：http://jsfiddle.net/gromer/2qyT7/1/

请注意，Fiddle中有几个console.logs，可能会让IE生气。

它不会隐藏IE中的option，但会被禁用。

编辑：我根据您在SO上找到的要求和答案拼凑了IE的这种解决方法。

新小提琴：http://jsfiddle.net/2qyT7/19/

Answer 2

您的代码示例不适用于任何浏览器。

'。链接'应该只是'.links'或'a.links'，当'#select_id'工作正常时你不需要'div.my_div #select_id'。

对于您的问题，看起来IE不喜欢Option元素上的display: none。您可能需要以编程方式删除并根据需要向Select添加选项。

Answer 3

......你确定它适用于chrome吗？ http://jsfiddle.net/KEfjM/2/这是一个CSS /浏览器支持问题，而不是jQuery问题。唯一的解决方案是从select中删除选项。

$(document).ready(function(){
    $('.links a').click(function(){
        var txt = $(this).text();    
        if( txt == 'Disable A C D'){
           $('#select_id').find("option[value='0'],option[value='6'],option[value='7']").detach();
        }
    });
});

Answer 4

它只适用于FF，它不应该。（see this jsFiddle）

This question was already asked too.

如果您确实要从选择列表中删除该选项，则应完全删除它们，而不是隐藏。如果您可能需要它们，请将它们移动到内存中的其他数组中。

在点击时使用jquery隐藏元素在IE上不起作用？

4 个答案: