select标签中option的显示隐藏控制(兼容IE)

问题描述：

　　在有些功能切换的时候，select标签中的某些option是要被隐藏的。但通过设置option的样式为 display:none根本无法隐藏option标签。（ie浏览器中option不支持display:none;）

解决方案：

<script>  

/*参数说明： 

需被控制的Select对象， 

需显示的option序号(留空则不处理) eg:[0,1,3]， 

需隐藏的option序号(留空则不处理) eg:[2,4,6] 

*/  

function toggleOptionShow(obj,arrShow,arrHide){  

function arrHandle(arr,type){  

if($.isArray(arr)){  

　　var len=arr.length;  

　　for(i=0;i<len;i++){  

　　　　var optionNow=obj.find("option").eq(arr[i]);  

　　　　var optionP=optionNow.parent("span");  

　　　　if(type=="show"){                     

　　　　　　if(optionP.size()){  

                        　　optionP.children().clone().replaceAll(optionP);   

                   　　}                 

                }else{  

　　　　　　　if(!optionP.size()){  

                        　　optionNow.wrap("<span style='display:none'></span>");  

                   　　 }  

                }  

        }  

  }  

    }  

    arrHandle(arrShow,"show");  

    arrHandle(arrHide,"hide");  

}  

</script>  

<select>  

    <option value="papername" selected="selected">选项一</option>  

    <option value="state">选项二</option>  

    <option value="state">选项三</option>  

    <option value="state">选项四</option>  

    <option value="state">选项五</option>  

    <option value="state">选项六</option>  

</select>  

<button onclick="toggleOptionShow($('select'),'',[0,1,3])">隐藏一,二,四</button> 

<button onclick="toggleOptionShow($('select'),[0,1,3],'')">显示一,二,四</button>