勉強したことのメモ

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

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

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

2025/01/05 jQuery JavaScript CSS

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

目次

1 対応方法
- 1.1 HTML&CSSで対応
- 1.2 jQueryで対応
2 参考サイト

対応方法

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

関連記事

: jQueryでループを抜けようと(breakしようと)するとエラーになる際の対応方法

jQueryでループを抜けようと(breakしようと)すると「Uncaught ...

: NicEdit(WYSIWYGエディタ)を再描写時にサイズを調整する方法

NicEdit(WYSIWYGエディタ)を設置しているサイトがあった。ページ読み ...

: ライブラリ等を使用せずファイルをドラッグ&ドロップでアップロードする方法

formにドラッグ&ドロップでファイルをアップロードする機能を実装する場 ...

: jQueryで画像が存在すれば表示、なければノーイメージ画像を表示

やりたかった事は以下の通り。・画像のURLはcode.jpgみたいになってる ...

: SortableJSを使ってデータの並べ替え&保存

あるシステムを拝見した際にtableタグ内に並んでいる項目をドラッグ&ド ...