select标签中option的显示隐藏控制(兼容IE)
生活随笔
收集整理的這篇文章主要介紹了
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 οnclick="toggleOptionShow($('select'),'',[0,1,3])">隱藏一,二,四</button> <button οnclick="toggleOptionShow($('select'),[0,1,3],'')">顯示一,二,四</button>?
?
轉載于:https://www.cnblogs.com/songmeiling/p/9225396.html
總結
以上是生活随笔為你收集整理的select标签中option的显示隐藏控制(兼容IE)的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 猜数字游戏的提示(UVa340)
- 下一篇: 【代码笔记】iOS-翻书效果的实现