jQuery Mobile Data 属性

jQuery Data အခြေအနေ

jQuery Mobile သည် HTML5 data-* အခြေအနေ ကို လက်ခံပြီး လက်လှမ်း ဖြစ်သော လက်ခံပြီး ဘယ်လူးသော ပုံစံ ကို ဖွဲ့စည်းပါသည်။

အောက်ရှိ ကိုးကားချက် စာရင်း တွင် အကြမ်းခတ် အချက်အလက် အချက်အလက် ချမှတ်ထားပါသည်။

Button

data-role="button" ဖြစ်သော အစီအစဉ်ချက်။ တန်ဖိုးလုံး အချက်အလက် နှင့် အသုံးပြုသော အသင်းချုပ် အချက်အလက် နှင့် အရွယ်အစား အပ်သော အကွက် အချက်အလက် သည် အသင်းချုပ် အပုံအခြား အချက်အလက် အသုံးပြုသည်၊ data-role="button" မပါဘူး။

Data 属性 描述
data-corners true | false ပေါင်းစပ် အဆင်းရဲ ရှိမည့် အခြေအနေ။
data-icon Icons Reference ပေါင်းစပ် အကွက် ချမှတ်ပါ၊ မူလ အကွက် မပါဘူး။
data-iconpos left | right | top | bottom | notext 规定图标的位置。
data-iconshadow true | false ပေါင်းစပ် အမှတ်အသား ရှိမည့် အကွက် အခြေအနေ။
data-inline true | false ပေါင်းစပ် အကွက် အခြေအနေ။
data-mini true | false ပေါင်းစပ် အရွယ် ချမှတ်ပါ။
data-shadow true | false ပေါင်းစပ် အမှတ်အသား ရှိမည့် အခြေအနေ။
data-theme letter (a-z) ပေါင်းစပ် အရောင် ချမှတ်ပါ။

提示:သုံးပုံစံ သုံးပုံစံ ပေါင်းစပ် ရန် အခြေအနေ data-role="controlgroup" နှင့် data-type="horizontal|vertical" အခြေအနေ အကွက် အသုံးပြုပါ၊ ပေါင်းစပ် ပုံစံ ကို ချမှတ်ပါ။

Checkbox

label 和 type="checkbox" 的 input 是成对的。会被自动设置为按钮的样式,无需 data-role。

Data 属性 描述
data-mini true | false 规定复选框是小型的还是常规尺寸的。
data-role none 防止 jQuery Mobile 将复选框设置为按钮的样式。
data-theme letter (a-z) 规定复选框的主题颜色。

提示:如需组合多个复选框,请使用 data-role="controlgroup" 以及 data-type="horizontal|vertical",来规定水平还是垂直组合复选框。

Collapsible

标题元素,其后是位于带有 data-role="collapsible" 属性的容器中的任意 HTML 标记。

Data 属性 描述
data-collapsed true | false 规定内容是否应该关闭或展开。
data-collapsed-icon Icons Reference 规定可折叠按钮的图标。默认是 "plus"。
data-content-theme letter (a-z) 规定可折叠内容的主题颜色。同时会向可折叠内容添加圆角。
data-expanded-icon Icons Reference အဆိုးအအားသုံး ပေါင်းစပ်မှု ဖွင့်သွားစဉ် ခုံးတွဲ အရိပ်ဖြစ်သော အရာ။ မူလအားဖြင့် "ကြွေး" ဖြစ်သည်。
data-iconpos left | right | top | bottom 规定图标的位置。
data-inset true | false အဆိုးအအားသုံး ပေါင်းစပ်မှု ခုံးတွဲ သည် အဆိုးအအားအရွယ် နှင့် အဆယ်အရွယ် အပုံစံ ဖြစ်သော အရွယ်တွင် တည်ရှိသည်။
data-mini true | false အဆိုးအအားသုံး ပေါင်းစပ်မှု ခုံးတွဲ သည် သိုးစင်းအရွယ် သို့မဟုတ် အရွယ်အဆိုးအအား ဖြစ်စေ တုန့်ပြုခြင်း。
data-theme letter (a-z) အဆိုးအအားသုံး ပေါင်းစပ်မှု ခုံးတွဲ အော်ငျား အရောင်အထောင် တုန့်ပြုခြင်း。

Collapsible Set

data-role="collapsible-set" အခြေအနေ ဖြစ်သော အကွက် အတွင်း အဆိုးအအားသုံး အခြေအနေ အဖွဲ့

Data 属性 描述
data-collapsed-icon Icons Reference အဆိုးအအားသုံး ပေါင်းစပ်မှု ခုံးတွဲ အရိပ်ဖ�ြစ်သော အရာ။ မူလအားဖြင့် "အပ်" ဖြစ်သည်。
data-content-theme letter (a-z) အဆိုးအအားသုံး အခြေအနေ အော်ငျား အရောင်အထောင် တုန့်ပြုခြင်း。
data-expanded-icon Icons Reference အဆိုးအအားသုံး ပေါင်းစပ်မှု ဖွင့်သွားစဉ် ခုံးတွဲ အရိပ်ဖြစ်သော အရာ။ မူလအားဖြင့် "ကြွေး" ဖြစ်သည်。
data-iconpos left | right | top | bottom | notext 规定图标的位置。
data-inset true | false အဆိုးအအားသုံး ပေါင်းစပ်မှု သည် အဆိုးအအားအရွယ် နှင့် အဆယ်အရွယ် အပုံစံ ဖြစ်သော အရွယ်တွင် တည်ရှိသည်။
data-mini true | false အဆိုးအအားသုံး ပေါင်းစပ်မှု ခုံးတွဲ သည် သိုးစင်းအရွယ် သို့မဟုတ် အရွယ်အဆိုးအအား ဖြစ်စေ တုန့်ပြုခြင်း。
data-theme letter (a-z) အဆိုးအအားသုံး ပေါင်းစပ်မှု အော်ငျား အရောင်အထောင် တုန့်ပြုခြင်း。

Content

data-role="content" အခြေအနေ ဖြစ်သော အကွက်。

Data 属性 描述
data-theme letter (a-z) အခြေအနေ ဖြစ်သော အော်ငျား အရောင်အထောင် တုန့်ပြုခြင်း။ မူလအားဖြင့် "c" ဖြစ်သည်。

Controlgroup

data-role="controlgroup" အခြေအနေ ဖြစ်သော <div> သို့မဟုတ် <fieldset> အကွက် သို့မဟုတ် အသုံးပြုကြသော ပေါင်းစပ်များအား အသုံးပြုခြင်း (ခုံးတွဲဖြင့် ခုံးတွဲဖြင့် ရွေးချယ်ရာ သို့မဟုတ် အဆိုးအအားချို့ သို့မဟုတ် အဆိုးအအားသုံး သို့မဟုတ် ရွေးချယ်ရာ များ)。

Data 属性 描述
data-mini true | false ပေါင်းစပ်မှု သည် သိုးစင်းအရွယ် သို့မဟုတ် အရွယ်အဆိုးအအား ဖြစ်စေ တုန့်ပြုခြင်း。
data-type horizontal | vertical ပေါင်းစပ်မှု သည် အဆိုးအအားချို့ သို့မဟုတ် အဆိုးအအားသုံး ဖြစ်စေ တုန့်ပြုခြင်း。

Dialog

data-role="dialog" ဖြစ်သော အကွက် သို့မဟုတ် data-rel="dialog" ဖြစ်သော ခုံးတွဲများ。

Data 属性 描述
data-close-btn-text sometext 规定仅用于对话框的关闭按钮的文本。
data-dom-cache true | false 规定是否为个别页面清除 jQuery DOM 缓存(如果设置 true,则需要注意对 DOM 的管理,并全面测试所有移动设备)。
data-overlay-theme letter (a-z) 规定对话页面的叠加(背景)色。
data-theme letter (a-z) အဆိုပါ အဆိုပါ အချက်အလက် အပိုင်း အပေါ် အစိတ်အသုံး အခြေအနေ အပေါ် မျိုးခွဲသည်。
data-title sometext အဆိုပါ အဆိုပါ အချက်အလက် အပိုင်း အပေါ် ခေါင်းစဉ် မျိုးခွဲသည်。

Enhancement

data-enhance="false" သို့မဟုတ် data-ajax="false" ဖြစ်သည် အပိုင်း အပေါ် ဖြစ်သည်。

Data 属性 描述
data-enhance true | false အားလုံး ဖြစ်သော အခါ 'true' ဖြင့် အချက်အလက် အပိုင်း အပေါ် jQuery Mobile သည် အချက်အလက် အပိုင်း အပေါ် ပေါ်ထွင်းသော အစိတ်အသုံး အား အချက်ပြုသည် သို့မဟုတ် 'false' ဖြင့် အချက်အလက် အပိုင်း အပေါ် အချက်ပြုခြင်း မပြုပါ။
data-ajax true | false အချက်အလက် အပိုင်း အပေါ် AJAX ဖြင့် အစားထိုးခြင်း မှတ်ချက်ပြုသည်。

စကားလုံးစကားလုံးdata-enhance="false" နှင့် အသုံးပြုခြင်း မှာ အချက်အလက် အပိုင်း အပေါ် jQuery Mobile သည် အချက်အလက် အပိုင်း အပေါ် ပေါ်ထွင်းသော အစိတ်အသုံး အား ပိတ်ပင်သည်。

when $.mobile.ignoreContentEnabled အား true အစား ရည်ရွယ်သည် အချက်အလက် အပိုင်း အပေါ် data-ajax="false" ဖြစ်သည် အသင်းများ သို့မဟုတ် အချက်အလက် အပိုင်း အပေါ် သတင်းပေးခြင်း ပိတ်ပင်သည်。

Fieldcontainer

label/form အဖွဲ့အစား အပိုင်း အပေါ် data-role="fieldcontain" ဖြစ်သည် အပိုင်း。

Fixed Toolbar

data-role="header" သို့မဟုတ် data-role="footer" ဖြစ်သည် အပိုင်း နှင့် data-position="fixed" ဖြစ်သည် အချက်အလက် အပေါ် ဖြစ်သည်。

Data 属性 描述
data-disable-page-zoom true | false အပေါ် စက်သုံးအုပ် ကို လုပ်ကိုင်နိုင်သည် အားလုံး ဖြစ်သည်。
data-fullscreen true | false အပေါ် စက်သုံးအုပ် အပေါ် သို့မဟုတ် အောက် သို့ ခုံးထားသည် အားလုံး ဖြစ်သည်。
data-tap-toggle true | false ဖြတ်တောက်/ရွှေ့ပူးကြောင်း ဖြစ်ပွားချိန်တွင် အပေါ် စက်သုံးအုပ် မှတ်ချက် မြင်တွေ့ခြင်း ဖြစ်သည် လိုသလို ဖြစ်နိုင်သည် အားလုံး ဖြစ်သည်。
data-transition slide | fade | none ဖြတ်တောက်/ရွှေ့ပူးကြောင်း ဖြစ်ပွားချိန်တွင် ဆောင်ရွက်သည် ဆိုသည့် အသံရောင်းဆိုက် ဖြစ်သည်。
data-update-page-padding true | false resize၊ transition စသည် ဖြစ်ပွားချိန်တွင် အချင်း အဝေး အနောက် အပေါ် ပြောင်းလဲကြောင်း သတင်းပေးသည်(jQuery Mobile သည် အချင်း အဝေး အနောက် ပြောင်းလဲကြောင်း သတင်းပေးသည် 'pageshow' အချင်း အဝေး အနောက် ဖြစ်ပွားချိန်တွင်')
data-visible-on-page-show true | false ပြောက်လုပ်ရာ အကောင်းကို ပြင်ဆင်သော အပေါ် စက်သုံးအုပ် မှတ်ချက်များ မျိုးခွဲသည်。

Flip Toggle Switch

带有 data-role="slider" 属性的一个 <select> 元素以及两个 <option> 元素。

Data 属性 描述
data-mini true | false 规定开关是小型的还是常规尺寸的。
data-role none 防止 jQuery Mobile 将切换开关设置为按钮样式。
data-theme letter (a-z) 规定切换开关的主题颜色。
data-track-theme letter (a-z) 规定轨道的主题颜色。

Footer

带有 data-role="footer" 属性的容器。

Data 属性 描述
data-id sometext 规定唯一 ID。对于 persistent footers 是必需的。
data-position inline | fixed 规定页脚与页面内容是行内关系,还是保留在底部。
data-fullscreen true | false 规定页面是否始终位于底部并覆盖页面内容 (slightly see-through)。
data-theme letter (a-z) 规定页脚的主题颜色。默认是 "a"。

စကားလုံးစကားလုံး如需启用 fullscreen 定位,请使用 data-position="fixed",然后为该元素添加 data-fullscreen 属性。

Header

data-role="header" 的容器。

Data 属性 描述
data-id sometext 规定唯一 ID。对于 persistent headers 是必需的。
data-position inline | fixed 规定页眉与页面内容是行内关系,还是保留在顶部。
data-fullscreen true | false 规定页面是否始终位于顶部并覆盖页面内容 (slightly see-through)。
data-theme letter (a-z) 规定页眉的主题颜色。默认是 "a"。

စကားလုံးစကားလုံး如需启用 fullscreen 定位,请使用 data-position="fixed",然后为该元素添加 data-fullscreen 属性。

Link

所有链接,包括 data-role="button" 的链接以及表单提交按钮。

Data 属性 描述
data-ajax true | false 规定是否通过 AJAX 来加载页面,以改进用户体验和过渡。如果设置为 false,则 jQuery Mobile 将进行普通的页面请求。
data-direction reverse 反转过渡动画(仅用于页面或对话)
data-dom-cache true | false 规定是否清除个别页面的 jQuery DOM 缓存(如果设置为 true,则您需要注意对 DOM 的管理,并全面测试所有移动设备)。
data-prefetch true | false 规定是否把页面预取到 DOM 中,以使其在用户访问时可用。
data-rel back | dialog | external | popup 规定有关链接如何行为的选项。 Back - 在历史记录中向后移动一步。 Dialog - 将页面作为对话来打开,不在历史中记录。 External - 链接到另一域。 opens - 打开弹出窗口。
data-transition fade | flip | flow | pop | slide | slidedown | slidefade | slideup | turn | none အချိန်ပြန်လည် အသုံးပြု ရန် ဘေ့စ်ဘီး ကို အသုံးပြု ရန် အဆိုပါ အချိန်ပြန်လည် ကို သတ်မှတ်ပါ။ အဆိုပါ အချိန်ပြန်လည် ကို အသုံးပြု ရန် အဆိုပါ jQuery Mobile ကို အသုံးပြုပါ။
data-position-to origin | jQuery selector | window 规定弹出框的位置。 Origin - 默认。在打开它的链接上弹出。 jQuery selector - 在指定元素上弹出。 Window - 在窗口屏幕中间弹出。

List

带有 data-role="listview" 属性的

      Data 属性 描述
      data-autodividers true | false 规定是否自动分隔列表项。
      data-count-theme letter (a-z) 规定计数泡沫的主题颜色。默认是 "c"。
      data-divider-theme letter (a-z) 规定列表分隔符的主题颜色。默认是 "b"。
      data-filter true | false လုပ်အားအပိုင်း ကို အသုံးပြုရန် ရည်ရွယ်ထားသည်။
      data-filter-placeholder sometext လုပ်အားအပိုင်း အချက်အလက် ကို ရည်ရွယ်ထားသည်။ မူလ အသုံးပြုသည်မှာ "Filter items..." ဖြစ်သည်။
      data-filter-theme letter (a-z) လုပ်အားအပိုင်း ပုံစံ ကို ရည်ရွယ်ထားသည်။ မူလ အသုံးပြုသည်မှာ "c" ဖြစ်သည်။
      data-icon Icons Reference လုပ်အားအပိုင်း ပုံစံ ကို ရည်ရွယ်ထားသည်။
      data-inset true | false လုပ်အားအပိုင်း ကို အဆန့်ချဲ့ပြီး အကွက်ကြား အဆန့်ချဲ့ အစိတ်အပိုင်း ကို အသုံးပြုရန် ရည်ရွယ်ထားသည်။
      data-split-icon Icons Reference လုပ်အားအပိုင်း ပုံစံ ကို ရည်ရွယ်ထားသည်။ မူလ အသုံးပြုသည်မှာ "arrow-r" ဖြစ်သည်။
      data-split-theme letter (a-z) လုပ်အားအပိုင်း ပုံစံ ကို ရည်ရွယ်ထားသည်။ မူလ အသုံးပြုသည်မှာ "b" ဖြစ်သည်။
      data-theme letter (a-z) လုပ်အားအပိုင်း ပုံစံ ကို ရည်ရွယ်ထားသည်။

List item

data-role="listview" ဗဟိုအချက်အလက် ပါဝင်သော <ol> သို့မဟုတ် <ul> အပြင်ဘက် အချက်အလက်

Data 属性 描述
data-filtertext sometext လုပ်အားအပိုင်း အချက်အလက် ကို ရည်ရွယ်ထားသည်။ အချက်အလက် ကို လုပ်အားအပိုင်း အချက်အလက် ကဲ့သို့ ရှာဖွေရန် အသုံးပြုသည်။
data-icon Icons Reference လုပ်အားအပိုင်း ပုံစံ ကို ရည်ရွယ်ထားသည်။
data-role list-divider လုပ်အားအပိုင်း ကာကွယ်ရိုက်ကွယ်ရိုက် ကို ရည်ရွယ်ထားသည်။
data-theme letter (a-z) လုပ်အားအပိုင်း ပုံစံ ကို ရည်ရွယ်ထားသည်။

စကားလုံးစကားလုံးdata-icon ဗဟိုအချက်အလက် သုံးစွဲသည်မှာ လွှတ်တိုက် ပါဝင်သော လုပ်အားအပိုင်း သာဖြစ်သည်။

Navbar

data-role="navbar" ဗဟိုအချက်အလက် အပြင်ဘက် အချက်အလက်

Data 属性 描述
data-icon Icons Reference လုပ်အားအပိုင်း ပုံစံ ကို ရည်ရွယ်ထားသည်။
data-iconpos left | right | top | bottom | notext 规定图标的位置。

提示:နောက်ဆုံးအပိုင်း အချက်အလက် ကို အသုံးပြုသည်။ နောက်ဆုံးအပိုင်း အချက်အလက် ကို ရည်ရွယ်သည်မှာ မဖြစ်နိုင်ပေ။ နောက်ဆုံးအပိုင်း အချက်အလက် ကို စတင်ပုံစံ အား အသုံးပြုရန် အခွင့်အရေး ဖြစ်သည်။

Page

data-role="page" ဗဟိုအချက်အလက် ဖြစ်သည်။

Data 属性 描述
data-add-back-btn true | false လုပ်အားအပိုင်း သို့ သွားသွားကြောင်း အသုံးပြုရန် အသုံးပြုသည်။ အသုံးပြုသည်မှာ ဘတ်မက်တိုက်အချက်အလက် ဖြစ်သည်။
data-back-btn-text sometext လုပ်အားအပိုင်း အချက်အလက် ကို ရည်ရွယ်ထားသည်။
data-back-btn-theme letter (a-z) လုပ်အားအပိုင်း ပုံစံ ကို ရည်ရွယ်ထားသည်။
data-close-btn-text letter (a-z) လုပ်အားအပိုင်း ပုံစံအား ရုပ်သုံးရန် ဖော်ပြထားသည်။
data-dom-cache true | false 规定是否清除个别页面的 jQuery DOM 缓存(如果设置为 true,则您需要注意对 DOM 的管理,并全面测试所有移动设备)。
data-overlay-theme letter (a-z) 规定对话页面的叠加(背景)色。
data-theme letter (a-z) 规定页面的主题颜色。默认是 "c"。
data-title sometext 规定页面的标题。
data-url url 该值用于更新 URL,而不是用于请求页面。

Popup

带有 data-role="popup" 属性的容器。

Data 属性 描述
data-corners true | false 规定弹出框是否有圆角。
data-overlay-theme letter (a-z) 规定弹出框的叠加(背景)色。默认是透明背景(none)。
data-shadow true | false 规定弹出框是否有阴影。
data-theme letter (a-z) 规定弹出框的主题颜色。默认是继承,"none" 设置为透明。
data-tolerance 30, 15, 30, 15 规定距离窗口边缘 (top, right, bottom, left) 的距离。

带有 data-rel="popup" 属性的锚:

Data 属性 描述
data-position-to origin | jQuery selector | window 规定弹出框的位置。 Origin - 默认。弹出框位于打开它的链接上。 jQuery selector - 弹出框位于指定元素上。 Window - 弹出框位于窗口屏幕中央。
data-rel popup အခွန့်အလမ်း အသုံးပြု ရန်
data-transition fade | flip | flow | pop | slide | slidedown | slidefade | slideup | turn | none အချိန်ပြန်လည် အသုံးပြု ရန် ဘေ့စ်ဘီး ကို အသုံးပြု ရန် အဆိုပါ အချိန်ပြန်လည် ကို သတ်မှတ်ပါ။ အဆိုပါ အချိန်ပြန်လည် ကို အသုံးပြု ရန် အဆိုပါ jQuery Mobile ကို အသုံးပြုပါ။

ရိုက်ပိုက် ဘေ့စ်ဘီး

label နှင့် type="radio" ကို အသုံးပြု ရန် input အဆိုးပါ နှင့် အတူ အသုံးပြု ရန် ဘေ့စ်ဘီး အပြုအမူ အသုံးပြု ရန် သင့် သည် အသုံးပြု ရန် မရှိ သင့် သည် data-role ကို အသုံးပြု ရန် မရှိ။

Data 属性 描述
data-mini true | false ဘေ့စ်ဘီး အဆိုးပါ ကို သတ်မှတ် ရန် သင့် သည် သို့မဟုတ် အဆိုးပါ ဆိုင်းဆိုင်း ကို သတ်မှတ်ပါ။
data-role none jQuery Mobile ကို အသုံးပြု ရန် ဘေ့စ်ဘီး အသုံးပြု ရန် အဆိုပါ ဘေ့စ်ဘီး အပြုအမူ ကို သတ်မှတ်ပါ။
data-theme letter (a-z) တစ်ခုခု တစ်ခု တစ်ခု တစ်ခု အသုံးပြု ရန် ဘေ့စ်ဘီး အရောင် ကို သတ်မှတ်ပါ။

提示:သုံးပိုင်းတူကဲ့သို့ တစ်ခုခု တစ်ခု တစ်ခု အသုံးပြု ရန် data-role="controlgroup" နှင့် data-type="horizontal|vertical" ကို အသုံးပြု သင့် သည် အဆိုပါ ဘေ့စ်ဘီး အချင်း အဆိုးပါ ပြီး အဆိုပါ ဘေ့စ်ဘီး အသုံးပြု ရန် ပြီးခဲ့ပါသည်။

Select

所有