Question

我试图用jquery隐藏一些<options>标签，但它似乎不起作用。

我想要隐藏所有具有rel属性的选项。
仅显示rel='3'

此代码适用于FF和Chrome。不适用于IE，Safari和Opera。

这是我的jsfiddle：

http://jsfiddle.net/RnfqW/4/

这是标记和脚本：

<select name="myselect" id="myselect" >
    <option value=''></option>
    <option rel='1' value='1A'>1A</option>
    <option rel='1' value='1B'>1B</option>
    <option rel='2' value='2A'>2A</option>
    <option rel='2' value='2B'>2B</option>
    <option rel='2' value='2C'>2C</option>
    <option rel='3' value='3A'>3A</option>
    <option rel='3' value='3B'>3B</option>
    <option rel='3' value='3C'>3C</option>
    <option rel='3' value='3D'>3D</option>
</select>

脚本：

$("#myselect [rel]").hide(); // hide all options
$("#myselect [rel=3]").show(); // hide whow only rel=3 options

Answer 1

您无法隐藏或显示选项。你必须做的是克隆你不想要的选择和删除选项标签。

编辑：像http://jsfiddle.net/RnfqW/5/

这样的东西

Answer 2

查看此代码并进行自定义。我希望它会有用......

$(function(){
    $.fn.extend({
        slidingSelect: function(options)
        {
            var select= $(this);
            var selector=select.selector;
           var selectedValue="";//=select.val();

            var divToggle=$("<div>"+selectedValue+"select Complaint<span style='float:right;'>&#x25BC;</span></div>").attr({id:select.attr("id")+"Toggle"}).click(function(){
                $(selector).slideToggle();
            }).insertBefore(select);

            select.attr("size",6);  
            select.change(function(){
                divToggle.html(select.val()+"<span style='float:right;'>&#x25BC;</span>");
                $(selector).slideToggle();
            });

        }       
    });
    $("#complaint").hide().slidingSelect();

});

试图用jquery隐藏一些选项标签不适用于IE，Safari和Opera

2 个答案: