【解決】SELECTタグにおけるOPTIONの暗黙制御(IE対応)
1513 ワード
問題の説明:
一部の機能が切り替わると、selectラベルの一部のoptionが非表示になります.ただし、optionのスタイルをdisplay:noneに設定することで、optionラベルを隠すことはできません.
ソリューション:
1、まずoptionのdisplay:noneを設定する案は実行できないに違いない.
2、あるネットユーザーが提出した2つの案:
1.optionラベルにdisabled=「disabled」属性を付けて使用不可を示します.このスキームはoptionを選択できないだけですが、隠していません.
2.非表示にするには、DOMツリーからoptionを除去し、除去したoptionをキャッシュし、表示するときにoptionをキャッシュから取り出してDOMツリーに入れるしかありません
きっと需要に合わないに違いない.
3、究極のシナリオ(各ブラウザとテスト互換):optionに親ラベルを追加し、親ラベルの非表示を設定します(ここではspanラベルを使用しています).表示する場合は親ラベルを除去すればいいです.
一部の機能が切り替わると、selectラベルの一部のoptionが非表示になります.ただし、optionのスタイルをdisplay:noneに設定することで、optionラベルを隠すことはできません.
ソリューション:
1、まずoptionのdisplay:noneを設定する案は実行できないに違いない.
2、あるネットユーザーが提出した2つの案:
1.optionラベルにdisabled=「disabled」属性を付けて使用不可を示します.このスキームはoptionを選択できないだけですが、隠していません.
2.非表示にするには、DOMツリーからoptionを除去し、除去したoptionをキャッシュし、表示するときにoptionをキャッシュから取り出してDOMツリーに入れるしかありません
きっと需要に合わないに違いない.
3、究極のシナリオ(各ブラウザとテスト互換):optionに親ラベルを追加し、親ラベルの非表示を設定します(ここではspanラベルを使用しています).表示する場合は親ラベルを除去すればいいです.
/* :
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");
}