Jquery-mobile-data-attributes
jQuery Mobile-データ属性
ボタン
クラス_ui-btn_を使用して、テキストや画像などのコンテンツを含むクリック可能なボタンを指定します。 バージョン1.4では非推奨です。 _data-role = "button" _属性を使用する代わりに、_ui-btn_属性を使用します。
次の表に、データ属性で使用されるボタン要素を示します。
| Sr.No. | Data-attribute & Description | Value |
|---|---|---|
| 1 |
data-corners ボタンに丸い角を含めるかどうかを定義します。 |
true |
| false | 2 |
data-icon ボタンのアイコンを定義します。 |
| Default is no icon | 3 |
data-iconpos アイコンの位置を定義します。 |
| left | right | top |
| bottom | 4 |
data-iconshadow ボタンのアイコンに影を含めるかどうかを定義します。 |
| true | false | 5 |
|
data-inline ボタンをインラインにするかどうかを定義します。 |
true | false |
| 6 |
data-mini ボタンを小さいサイズで表示するか、通常のサイズで表示するかを定義します。 |
true |
| false | 7 |
data-shadow ボタンに影を含めるかどうかを定義します。 |
| true | false | 8 |
チェックボックス
次の表に、 _ type = "checkbox" _ で使用されるチェックボックス要素を示します。
| Sr.No. | Data-attribute & Description | Value |
|---|---|---|
| 1 |
data-mini チェックボックスを小さいサイズで表示するか、通常のサイズで表示するかを定義します。 |
true |
| false | 2 |
data-role ボタンとしてのチェックボックスのスタイル設定を停止します。 |
| none | 3 |
data-theme チェックボックスのテーマの色が表示されます。 |
折りたたみ可能
次の表に、 _ data-role = "collapsible" _ 属性で使用される折りたたみ可能な要素を示します。
| Sr.No. | Data-attribute & Description | Value |
|---|---|---|
| 1 |
data-collapsed コンテンツを閉じるか展開するかを示します。 |
true |
| false | 2 |
data-collapsed-cue-text スクリーンリーダーソフトウェアを使用するユーザーにフィードバックを表示します。 |
| Default is collapsing content | 3 |
data-collapsed-icon 折りたたみ可能なボタンのアイコンを定義します。 |
| Default icon is "plus" | 4 |
data-content-theme 折りたたみ可能なコンテンツのテーマの色が表示されます。 |
| letter (a-z) | 5 |
data-expanded-cue-text スクリーンリーダーソフトウェアを使用するユーザーにフィードバックを表示します。 |
| Default is expanding content | 6 |
data-expanded-icon コンテンツを展開すると、折りたたみ可能なボタンが表示されます。 |
| Default icon is "minus" | 7 |
data-iconpos アイコンの位置を定義します。 |
| left | right | top |
| bottom | 8 |
data-inset 折りたたみ可能なボタンを丸い角とマージンで表示するかどうかを定義します。 |
| true | false | 9 |
|
data-mini 折りたたみ可能なボタンを小さいサイズで表示するか、通常のサイズで表示するかを定義します。 |
true | false |
| 10 |
data-theme 折りたたみ可能なボタンのテーマの色が表示されます。 |
letter (a-z) |
折りたたみセット
次の表に、 _ data-role = "collapsibleset" _ 属性で使用される折りたたみ可能なセット要素を示します。
| Sr.No. | Data-attribute & Description | Value |
|---|---|---|
| 1 |
data-collapsed-icon 折りたたみ可能なボタンのアイコンを定義します。 |
Default icon is "plus" |
| 2 |
data-content-theme 折りたたみ可能なコンテンツのテーマの色が表示されます。 |
letter (a-z) |
| 3 |
data-expanded-icon コンテンツを展開すると、折りたたみ可能なボタンが表示されます。 |
Default icon is "minus" |
| 4 |
data-iconpos アイコンの位置を定義します。 |
left |
| right | top | bottom |
| 5 |
data-inset 折りたたみ可能なボタンを丸い角とマージンで表示するかどうかを定義します。 |
true |
| false | 6 |
data-mini 折りたたみ可能なボタンを小さいサイズで表示するか、通常のサイズで表示するかを定義します。 |
| true | false | 7 |
対照群
次の表に、 _ data-role = "controlgroup" _ 属性で使用されるControlgroup要素を示します-
| Sr.No. | Data-attribute & Description | Value |
|---|---|---|
| 1 |
data-exclude-invisible 角丸の割り当てで不可視の子を除外するかどうかを定義します。 |
true |
| false | 2 |
data-mini グループを小さいサイズで表示するか、通常のサイズで表示するかを定義します。 |
| true | false | 3 |
|
data-theme コントロールグループのテーマの色が表示されます。 |
letter (a-z) | 4 |
|
data-type グループを水平または垂直のどちらの形式で表示するかを示します。 |
horizontal | vertical |
ダイアログ
次の表に、 _ data-dialog = "true" _ 属性で使用されるダイアログ要素を示します。
| Sr.No. | Data-attribute & Description | Value |
|---|---|---|
| 1 |
data-close-btn 閉じるボタンの位置を定義します。 |
left |
| right | none | 2 |
|
data-close-btn-text 閉じるボタンのテキストを定義します。 |
text | 3 |
|
data-corners ダイアログを丸い角で表示するかどうかを定義します。 |
true | false |
| 4 |
data-dom-cache 個々のページのDOMキャッシュをクリアする必要があるかどうかを示します。 |
true |
| false | 5 |
data-overlay-theme ダイアログページのオーバーレイカラーを定義します。 |
| letter (a-z) | 6 |
data-theme ダイアログページのテーマの色を定義します。 |
| letter (a-z) | 7 |
data-title ダイアログページのタイトルを定義します。 |
強化
次の表に、 _ data-enhance = "false"またはdata-ajax = "false" _ 属性で使用される拡張要素を示します。
シニア
データ属性と説明
値
1
データ拡張
この属性を「true」に設定すると、ページのスタイルを設定できます。 「false」に設定されている場合、ページのスタイルを設定できません。
真|偽
2
*data-ajax*ページをAjaxから読み込む必要があるかどうかを示します。
真|偽
固定ツールバー
次の表に、 _ data-position = "fixed" _ 属性で使用されるツールバー要素を示します。
シニア
データ属性と説明
値
1
*data-disable-page-zoom*ユーザーがページを拡大/縮小できるかどうかを定義します。
真|偽
2
データフルスクリーン
ツールバーを上部または下部に配置する必要があることを定義します。
真|偽
3
データタップ-トグル
ユーザーがタップでツールバーの表示を切り替えることができるかどうかを示します。
真|偽
4
データ遷移
要素をタップまたはクリックすると、遷移効果が表示されます。
スライド|フェード|なし
5
データ更新ページのパディング
サイズ変更、遷移、および更新レイアウトイベントを使用して、ページのパディングを更新します。
真|偽
6
ページ上に表示されるデータ
親ページが表示されるときのツールバーの可視性を定義します。
真|偽
フリップトグルスイッチ
次の表に、 _ data-role = "flipswitch" _ 属性で使用されるフリップトグル要素を示します-
シニア
データ属性と説明
値
1
データミニ
スイッチがより小さなサイズで表示されるか、通常のサイズで表示されるかを定義します。
真|偽
2
テキスト上のデータ
フリップスイッチの「オン」テキストを定義します。
デフォルトは「オン」です
3
データオフテキスト
フリップスイッチの「オフ」テキストを定義します。
デフォルトは「オフ」です
フッター
次の表に、_data-role = "footer" _属性で使用されるフッター要素を示します-
シニア
データ属性と説明
値
1
- データID *
一意のIDを定義します。
text
2
データ位置
フッターをページコンテンツの下部に配置するかインラインに配置するかを定義します。
インライン|一定
3
データフルスクリーン
フッターをページコンテンツの下部に配置するかどうかを定義します。
真|偽
4
データテーマ
フッターのテーマの色を定義します。
レター（a-z）
ヘッダ
次の表に、 _ data-role = "header" _ 属性で使用されるヘッダー要素を示します。
シニア
データ属性と説明
値
1
- データID *
一意のIDを定義します。
text
2
データ位置
ヘッダーをページコンテンツの下部に配置するかインラインに配置するかを定義します。
インライン|一定
3
データフルスクリーン
ヘッダーをページコンテンツの下部に配置するかどうかを定義します。
真|偽
4
データテーマ
ヘッダーのテーマの色を定義します。
レター（a-z）
入力
次の表に、 _ type = "text | search | etc" _ 属性で使用される入力要素を示します。
シニア
データ属性と説明
値
1
*data-clear-btn*入力要素にクリアボタンを含めるかどうかを定義します。
真|偽
2
*data-clear-btn-text*クリアボタンのテキストを定義します。
text
3
データミニ
入力を小さいサイズで表示するか、通常のサイズで表示するかを定義します。
真|偽
4
データロール
入力領域またはテキスト領域のボタンとしてのスタイル設定を停止します。
none
5
データテーマ
入力要素のテーマの色を定義します。
レター（a-z）
Link
次の表に、jQuery Mobileで使用されるリンク要素を示します。
シニア
データ属性と説明
値
1
*data-ajax*ページをAjaxで読み込む必要があるかどうかを示します。
真|偽
2
データの方向
逆遷移に使用されます。
逆
3
*data-dom-cache*ページのjQuery DOMキャッシュをクリアする必要があるかどうかを示します。
真|偽
4
データプリフェッチ
ページをDOMにプリフェッチするために使用されます。
真|偽
5
*data-rel*リンクの動作を指定します。
戻る|ダイアログ|外部|現れる
6
データ遷移
あるページから別のページへの遷移を定義します。
フェード|フリップ|フロー|ポップ|スライド|スライドダウン|スライドフェード|スライドアップ|ターン|なし
7
データ位置-
ポップアップボックスの位置を定義します。
起源| jQueryセレクター|窓
List
次の表は、 _ data-role = "listview" _ 属性で使用されるリスト要素を示しています。
| Sr.No. | Data-attribute & Description | Value |
|---|---|---|
| 1 |
data-autodividers リストを自動的に分割します。 |
true |
| false | 2 |
data-count-theme count要素のテーマの色を定義します。 |
| letter (a-z) | 3 |
data-divider-theme リスト区切り線のテーマの色を定義します。 |
| letter (a-z) | 4 |
data-filter 検索ボックス内のリスト値をフィルタリングするために使用されます。 |
| true | false | 5 |
|
data-filter-placeholder 検索ボックス内のテキストを定義します。 |
text | 6 |
|
data-filter-theme 検索フィルターのテーマの色を定義します。 |
letter (a-z) | 7 |
|
data-icon リストのアイコンを提供します。 |
Default is no icon | 8 |
|
data-inset リストを丸い角とマージンで表示するかどうかを定義します。 |
true | false |
| 9 |
data-split-icon 分割ボタンのアイコンを定義します。 |
The default icon is "arrow-r" |
| 10 |
data-split-theme 分割ボタンのテーマの色を定義します。 |
letter (a-z) |
| 11 |
data-theme リストのテーマの色を定義します。 |
letter (a-z) |
リスト項目
次の表は、 _ data-role = "listview" _ 属性で使用されるリスト項目要素を示しています。
| Sr.No. | Data-attribute & Description | Value |
|---|---|---|
| 1 |
data-filtertext 検索ボックス内のテキストを使用してリスト値をフィルタリングするために使用されます。 |
text |
| 2 |
data-icon リストアイテムのアイコンを提供します。 |
Default is no icon |
| 3 |
data-role リストアイテムの区切り線を定義します。 |
list-divider |
| 4 |
data-theme リストアイテムのテーマの色を定義します。 |
letter (a-z) |
ナビバー
次の表に、 _ data-role = "navbar" _ 属性で使用されるnavbar要素を示します。
| Sr.No. | Data-attribute & Description | Value |
|---|---|---|
| 1 |
data-icon リストアイテムのアイコンを提供します。 |
Default is no icon |
| 2 |
data-iconpos アイコンの位置を定義します。 |
left |
| right | top | bottom |
Page
次の表に、 _ data-role = "page" _ 属性で使用されるページ要素を示します。
| Sr.No. | Data-attribute & Description | Value |
|---|---|---|
| 1 |
data-dom-cache 個々のページのDOMキャッシュをクリアする必要があるかどうかを示します。 |
true |
| false | 2 |
data-overlay-theme ダイアログページのオーバーレイカラーを定義します。 |
| letter (a-z) | 3 |
data-theme ページのテーマの色を定義します。 |
| letter (a-z) | 4 |
data-title ページのタイトルを提供します。 |
| Default is no icon | 5 |
data-url URLの更新に使用されます。 |
現れる
次の表に、 _ data-role = "popup" _ 属性で使用されるポップアップ要素を示します。
| Sr.No. | Data-attribute & Description | Value |
|---|---|---|
| 1 |
data-corners ポップアップを丸い角とマージンで表示するかどうかを定義します。 |
true |
| false | 2 |
data-dismissible 外部をクリックしてポップアップを閉じるかどうかを定義します。 |
| true | false | 3 |
|
data-history ポップアップを開いたときにアイテムの履歴を表示するかどうかを定義します。 |
true | false |
| 4 |
data-overlay-theme ポップアップボックスのオーバーレイカラーを定義します。 |
letter (a-z) |
| 5 |
data-shadow ポップアップボックスの影を表示します。 |
true |
| false | 6 |
data-theme ポップアップボックスのテーマの色を定義します。 |
| letter (a-z) | 7 |
data-tolerance ウィンドウのエッジを定義します。 |
ラジオボタン
次の表に、 _ type = "radio" _ 属性で使用されるラジオボタン要素を示します。
| Sr.No. | Data-attribute & Description | Value |
|---|---|---|
| 1 |
data-mini ボタンを小さいサイズで表示するか、通常のサイズで表示するかを定義します。 |
true |
| false | 2 |
data-role 拡張ボタンとしてのラジオボタンのスタイル設定を停止します。 |
| none | 3 |
data-theme ラジオボタンのテーマの色を定義します。 |
選択する
次の表に、jQuery Mobileで使用されるselect要素を示します。
| Sr.No. | Data-attribute & Description | Value |
|---|---|---|
| 1 |
data-icon select要素のアイコンを提供します。 |
Default is "arrow-d" |
| 2 |
data-iconpos アイコンの位置を定義します。 |
left |
| right | top | bottom |
| 3 |
data-inline ボタンをインラインにするかどうかを定義します。 |
true |
| false | 4 |
data-mini selectが小さいサイズで表示するか、通常のサイズで表示するかを定義します。 |
| true | false | 5 |
|
data-native-menu falseに設定されている場合、カスタムメニューを使用します。 |
true | false |
| 6 |
data-overlay-theme カスタム選択メニューのオーバーレイの色を定義します。 |
letter (a-z) |
| 7 |
data-placeholder 非ネイティブ選択のオプション要素を設定するために使用されます。 |
true |
| false | 8 |
data-role 選択要素のボタンとしてのスタイル設定を停止します。 |
| none | 9 |
data-theme 選択した要素のテーマの色が表示されます。 |
スライダー
次の表に、 _ type = "range" _ 属性で使用されるスライダー要素を示します。
| Sr.No. | Data-attribute & Description | Value |
|---|---|---|
| 1 |
data-highlight スライダーが強調表示されます。 |
true |
| false | 2 |
data-mini スライダーを小さいサイズで表示するか、通常のサイズで表示するかを定義します。 |
| true | false | 3 |
|
data-role スライダーコントロールのボタンとしてのスタイル設定を停止します。 |
none | 4 |
|
data-theme スライダーコントロールのテーマの色が表示されます。 |
letter (a-z) | 5 |
link：/index [Tutorials Point、title = "Tutorials Point"]
- リンク：/about/index [__私たちについて]
- リンク：/about/about_terms_of_use [__利用規約]
- リンク：/about/about_privacy [__プライバシーポリシー]
- リンク：/about/faq [__ FAQ’s]
- リンク：/about/about_helping [__ Helping]
- リンク：/about/contact_us [__連絡先]
©Copyright 2019。 全著作権所有。
