jQuery Mobileのselectフォームを非表示にする

jQuery Mobileではselectフォームを非表示にする際、
以下のようにselectタグそのものを対象に操作しても
正常に動きません。

     $('select').hide();

というのも、jQuery Mobileでselectフォームの見た目を担って
いるのはselectタグではなく、selectタグを取り込んだdivタグ
だからです。

なので、上記のようにselectタグのみhide()にすると、見た目は
そのままで、selectフォームが動かない。という状態になります。

このselectタグを囲むdivタグは、jQuery Mobileによって自動的に
割り当てられるので、以下のようにして非表示にします。

    $('select').parent().hide();

もしくは、以下のように自分でselect分を囲むdivタグを追加し、
その追加したdivタグに表示/非表示の操作をする、という方法も
あります。
(この場合ももちろんjQuery Mobileによるdivタグの追加は行われます。)


$(function(){
    $('#wrapper').hide();
});

bobo bobo bobo bobo bobo

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

次のHTML タグと属性が使えます: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>