勉強したことのメモ

Webエンジニア / プログラマが勉強したことのメモ。

セレクトメニュー(プルダウン)をdisplay:none;指定してもiPhoneのみ非表示にならない問題の対応方法

  jQuery JavaScript CSS

セレクトメニュー(プルダウン)に対してdisplay:none;指定したりjQueryでhide()指定してもiPhoneのみ非表示にならないという問題が発生した。以下に対応方法をメモ。

 

対応方法

HTML&CSSで対応

<style>
.hide{
    display:none;
}
</style>
<select>
    <span class="hide">
        <option>非表示にしたい項目</option>
    </span>
</select>

jQueryで対応

$(`非表示にしたい選択肢のセレクタ`).wrap(`<span style="display:none;"></span>`);

 

参考サイト

https://stackoverflow.com/questions/36066953/css-hide-options-from-select-menu-on-iphone-safari

 - jQuery JavaScript CSS

  関連記事

summernote(WYSIWYGエディタ)の設置方法と日本語化対応
summernote(WYSIWYGエディタ)の設置方法と日本語化対応

あるシステムにWYSIWYGエディタを実装したかった。以前にメモしたCKEdit ...

テキストエリアを選択すると中身を全選択状態にする方法
テキストエリアを選択すると中身を全選択状態にする方法

テキストエリアやテキストボックスの中に文字が書いてあり、ドラッグをしなくても、そ ...

ブラウザ上で何らかのファイルをダウンロードさせた際、ダウンロード完了のタイミングを検知する方法
ブラウザ上で何らかのファイルをダウンロードさせた際、ダウンロード完了のタイミングを検知する方法

ページ上でボタンをクリックすると画像やzipファイル等をダウンロードできるという ...

jQueryでHTMLの特定要素をループ時に逆順で処理する方法
jQueryでHTMLの特定要素をループ時に逆順で処理する方法

jQueryでリスト(li)タグ等の特定要素をeach()でループ処理する場合、 ...

jQueryでjsonデータを処理(parseJSON)
jQueryでjsonデータを処理(parseJSON)

他社が作成したシステムのちょっと改修案件があった。設置したもののどうも動かないと ...