jQuery モバイル クラシ...login
jQuery モバイル クラシック チュートリアル
著者:php.cn  更新時間:2022-04-11 13:58:34

jQueryモバイルフォームの選択



jQuery Mobile 選択メニュー

iPhone でメニューを選択します。
Android/SGS4 デバイスの選択メニュー:

<select> 要素は、いくつかのオプションを含むドロップダウン リストを作成します。

<select> 要素内の <option> リストで使用できるオプションを定義します。

リーリー

実行中のインスタンス »

[インスタンスの実行] ボタンをクリックして、オンライン インスタンスを表示します。

ヒント: 関連するオプションを含む長いリストがある場合は、<select> 内で <optgroup> 要素を使用します。

リーリー

実行中のインスタンス »

[インスタンスの実行] ボタンをクリックして、オンライン インスタンスを表示します。


カスタム選択メニュー

このページの上部の画像は、モバイル プラットフォームでこれらを使用して選択メニューを表示する方法を示しています。

選択メニューをすべてのモバイル デバイスで同じに表示したい場合は、data-native-menu="false" 属性を指定した jQuery 独自のカスタム選択メニューを使用します。

リーリー

実行中のインスタンス »

[インスタンスの実行] ボタンをクリックして、オンライン インスタンスを表示します。


複数の選択肢

選択メニューで複数のオプションを選択するには、<select> 要素の multiple 属性を使用します。

リーリー

インスタンスを実行する »

[インスタンスの実行] ボタンをクリックして、オンライン インスタンスを表示します。


实例

他の例

使用 data-role="コントロールグループ"

リーリー

実行中のインスタンス »

[インスタンスの実行] ボタンをクリックして、オンライン インスタンスを表示します。

1 つまたは複数の選択メニューを組み合わせる方法。

使用 データ型="水平"

リーリー

実行中のインスタンス »

[インスタンスの実行] ボタンをクリックして、オンライン インスタンスを表示します。

選択メニューを水平方向に結合する方法。

事前に選択されたオプション

リーリー

実行中のインスタンス »

[インスタンスの実行] ボタンをクリックして、オンライン インスタンスを表示します。

オプションを事前に選択する方法。

使用 データ型="ミニ"

リーリー

実行中のインスタンス »

[インスタンスの実行] ボタンをクリックして、オンライン インスタンスを表示します。

オプションメニューを縮小する方法

ポップアップオプション

リーリー

実行中のインスタンス »

[インスタンスの実行] ボタンをクリックして、オンライン インスタンスを表示します。

ポップアップ オプション メニューを作成する方法。

折りたたみ可能なフォーム

リーリー

実行中のインスタンス »

[インスタンスの実行] ボタンをクリックして、オンライン インスタンスを表示します。

折りたたみ可能なフォームを作成する方法

デフォルトの選択アイコンを変更する

リーリー

実行中のインスタンス »

[インスタンスの実行] ボタンをクリックして、オンライン インスタンスを表示します。

オプションメニューアイコン(デフォルトは「arrow-d」)を変更する方法。

アイコンの位置を変更する

リーリー

実行中のインスタンス »

[インスタンスの実行] ボタンをクリックして、オンライン インスタンスを表示します。

アイコンの表示位置を変更する方法(デフォルトは右側)。

PHP中国語ウェブサイト