जक्वेरी मोबाइल डेटा एट्रिब्यूट

jQuery Data 属性

jQuery Mobile 使用 HTML5 data-* 属性为移动设备创建“对触摸友好的”美观的外观。

在下面的参考列表中,粗体值规定默认值。

Button

带有 data-role="button" 的超链接。工具栏中的按钮元素和链接以及输入字段会被自动设置按钮的样式,无需 data-role="button"。

डेटा एट्रिब्यूट मूल्य वर्णन
data-corners ट्रू | फॉल्स 规定按钮是否有圆角。
data-icon Icons Reference 规定按钮的图标。默认是没有图标。
data-iconpos बाईं | दायाँ | ऊपर | नीचे | notext चिह्न का स्थान को निर्धारित करता है。
data-iconshadow ट्रू | फॉल्स 规定按钮图标是否有阴影。
data-inline ट्रू | फॉल्स 规定按钮是否是行内的。
डेटा-मिनी ट्रू | फॉल्स 规定按钮是小型的还是常规尺寸的。
data-shadow ट्रू | फॉल्स 规定按钮是否有阴影。
डेटा-थीम लेटर (ए-जी) 规定按钮的主题颜色。

सूचना:如需组合多个按钮,请使用带有 data-role="controlgroup" 以及 data-type="horizontal|vertical" 属性的容器,来规定水平还是垂直组合按钮。

Checkbox

label और type="checkbox" के input एक-दूसरे के साथ जुड़े हैं। उन्हें स्वतः बटन शैली में सेट कर दिया जाएगा, data-role की आवश्यकता नहीं है।

डेटा एट्रिब्यूट मूल्य वर्णन
डेटा-मिनी ट्रू | फॉल्स चेकबॉक्स को छोटे आकार का या सामान्य आकार का निर्देश देता है।
डेटा-रोल नहीं jQuery Mobile को चेकबॉक्स को बटन शैली में सेट करने से रोकता है।
डेटा-थीम लेटर (ए-जी) चेकबॉक्स के विषय का रंग निर्देशित करता है।

सूचना:अनेक चेकबॉक्स को संयोजित करने के लिए data-role="controlgroup" और data-type="horizontal|vertical" का उपयोग करें, ताकि चेकबॉक्स को किनारे स्थिति या खंड स्थिति में संयोजित किया जा सके।

Collapsible

शीर्षक तत्व, उसके बाद दिए गए data-role="collapsible" अभियान्त्रिक के कंटेनर में किसी भी HTML टैग के अधीन है।

डेटा एट्रिब्यूट मूल्य वर्णन
data-collapsed ट्रू | फॉल्स सामग्री को बंद करना या खोलना चाहिए का निर्देश देता है।
data-collapsed-icon Icons Reference समिकरण बटन के चिह्न निर्देशित करता है। मूलभूत रूप से "जोड़ना" है।
data-content-theme लेटर (ए-जी) समिकरण सामग्री के विषय का रंग निर्देशित करता है। साथ ही समिकरण सामग्री को कोणीय भी जोड़ता है।
data-expanded-icon Icons Reference सामग्री खोले जाने पर समिकरण बटन के चिह्न निर्देशित करता है। मूलभूत रूप से "घटक" है।
data-iconpos left | right | top | bottom चिह्न का स्थान को निर्धारित करता है。
data-inset ट्रू | फॉल्स समिकरण बटन को कोणीय और बाह्य सीमा का शैली निर्देशित करता है।
डेटा-मिनी ट्रू | फॉल्स समिकरण बटन को छोटे आकार का या सामान्य आकार का निर्देश देता है।
डेटा-थीम लेटर (ए-जी) समिकरण बटन के विषय का रंग निर्देशित करता है।

Collapsible Set

data-role="collapsible-set" अभियान्त्रिक के कंटेनर में समिकरण सामग्री ब्लॉक।

डेटा एट्रिब्यूट मूल्य वर्णन
data-collapsed-icon Icons Reference समिकरण बटन के चिह्न निर्देशित करता है। मूलभूत रूप से "जोड़ना" है।
data-content-theme लेटर (ए-जी) समिकरण सामग्री के विषय का रंग निर्देशित करता है।
data-expanded-icon Icons Reference सामग्री खोले जाने पर समिकरण बटन के चिह्न निर्देशित करता है। मूलभूत रूप से "घटक" है।
data-iconpos बाईं | दायाँ | ऊपर | नीचे | notext चिह्न का स्थान को निर्धारित करता है。
data-inset ट्रू | फॉल्स समिकरण को कोणीय और बाह्य सीमा का शैली निर्देशित करता है।
डेटा-मिनी ट्रू | फॉल्स समिकरण बटन को छोटे आकार का या सामान्य आकार का निर्देश देता है।
डेटा-थीम लेटर (ए-जी) समिकरण समूह के विषय का रंग निर्देशित करता है।

Content

data-role="content" अभियान्त्रिक के कंटेनर।

डेटा एट्रिब्यूट मूल्य वर्णन
डेटा-थीम लेटर (ए-जी) सामग्री के विषय का रंग निर्देशित करता है। मूलभूत रूप से "c" है।

Controlgroup

data-role="controlgroup" अभियान्त्रिक के <div> या <fieldset> कंटेनर के साथ जुड़े हैं। एकल तरह के बटन शैली के अनेक input (लिंक आधारित बटन, रेडियो बटन, चेकबॉक्स, चयन सूची) को संयोजित करें।

डेटा एट्रिब्यूट मूल्य वर्णन
डेटा-मिनी ट्रू | फॉल्स संयोजन को छोटे आकार का या सामान्य आकार का निर्देश देता है।
data-type horizontal | vertical संयोजन को किनारे स्थिति या खंड स्थिति में प्रदर्शित करने का निर्देश देता है।

डायलॉग

data-role="dialog" का कंटेनर या data-rel="dialog" का लिंक है।

डेटा एट्रिब्यूट मूल्य वर्णन
data-close-btn-text sometext विन्दु के बंद करने के लिए उपयोग किए जाने वाले टेक्स्ट को निर्धारित करता है
data-dom-cache ट्रू | फॉल्स अलग-अलग पृष्ठ के लिए jQuery DOM कैश निष्क्रिय करने के लिए निर्धारित करता है (यदि true सेट किया जाता है, तो डॉम का प्रबंधन और सभी मोबाइल उपकरणों के लिए पूर्ण परीक्षण करना चाहिए)
data-overlay-theme लेटर (ए-जी) वार्तापत्र पृष्ठ का अधिकार (पृष्ठभूमि) रंग निर्धारित करें।
डेटा-थीम लेटर (ए-जी) वार्तापत्र पृष्ठ के विषय रंग को निर्धारित करता है
data-title sometext वार्तापत्र पृष्ठ के शीर्षक को निर्धारित करता है

Enhancement

data-enhance="false" या data-ajax="false" गुण वाले कंटेनर

डेटा एट्रिब्यूट मूल्य वर्णन
data-enhance ट्रू | फॉल्स यदि "true" में सेट किया जाता है, (मूलभूत) jQuery Mobile पृष्ठ को स्वचालित रूप से शैली जोड़ता है, जो मोबाइल उपकरण के लिए अधिक उपयुक्त है। यदि "false" में सेट किया जाता है, तो फ्रेमवर्क पृष्ठ की शैली नहीं निर्धारित करेगा
data-ajax ट्रू | फॉल्स पृष्ठ को AJAX के द्वारा लोड करने के लिए निर्धारित करता है

टिप्पणी:data-enhance="false" जैसे कि $.mobile.ignoreContentEnabled=true द्वारा उपयोग किया जाता है, जिससे jQuery Mobile विन्यास को स्वचालित रूप से जोड़ नहीं करता

जब $.mobile.ignoreContentEnabled चालू हो तो, data-ajax="false" के कंटेनर के किसी भी लिंक या फॉर्म एलिमेंट को फ्रेमवर्क की नेविगेशन कार्य्क्रम नज़रअंदाज़ कर दिया जाता है

Fieldcontainer

label/form एलिमेंट के data-role="fieldcontain" के कंटेनर को पैकेज करता है

स्थिर टूलबार

data-role="header" या data-role="footer" गुण और data-position="fixed" गुण वाले कंटेनर

डेटा एट्रिब्यूट मूल्य वर्णन
data-disable-page-zoom ट्रू | फॉल्स इस बात को निर्धारित करता है कि उपयोगकर्ता क्या पृष्ठ को जोड़-खोज कर सकता है。
data-fullscreen ट्रू | फॉल्स टूलबार को हमेशा ऊपरी और/या निचले स्थान पर रखता है。
data-tap-toggle ट्रू | फॉल्स इस बात को निर्धारित करता है कि उपयोगकर्ता क्या टैप/क्लिक के द्वारा टूलबार की दृश्यमानता को टॉगल कर सकता है。
data-transition स्लाइड | फेड | नहीं ट्रांसिशन का प्रभाव प्रदर्शित करता है जब कोई टैप या क्लिक होता है。
data-update-page-padding ट्रू | फॉल्स resize, transition और "updatelayout" इवेंट होने पर पृष्ठ के ऊपरी, निचले और आंतरिक मार्गदर्शन (jQuery Mobile हमेशा "pageshow" इवेंट होने पर आंतरिक मार्गदर्शन अद्यतन करता है) को अद्यतन करता है
data-visible-on-page-show ट्रू | फॉल्स दिखाए जाने वाले मूल पृष्ठ के टूलबार की दृश्यमानता को निर्धारित करता है。

फ्लिप टॉगल स्विच

data-role="slider" गुण वाले एक <select> एलीमेंट और दो <option> एलीमेंट

डेटा एट्रिब्यूट मूल्य वर्णन
डेटा-मिनी ट्रू | फॉल्स स्विच का आकार छोटा या सामान्य है।
डेटा-रोल नहीं jQuery Mobile को स्विच को बटन शैली में सेट करने से रोकता है。
डेटा-थीम लेटर (ए-जी) स्विच का थीम रंग निर्धारित करता है。
data-track-theme लेटर (ए-जी) ट्रैक का थीम रंग निर्धारित करता है。

फुटर

data-role="footer" गुण वाले कंटेनर

डेटा एट्रिब्यूट मूल्य वर्णन
data-id sometext एकल आईडी निर्धारित करता है।स्थायी फुटर के लिए आवश्यक है。
data-position इनलाइन | फिक्स्ड फुटर और पृष्ठ सामग्री के बीच इनलाइन या तल पर रहने के लिए निर्धारित करता है。
data-fullscreen ट्रू | फॉल्स पृष्ठ को हमेशा तल पर रखता है और पृष्ठ सामग्री को ओवरले करता है (कुछ हद तक पारदर्शी)。
डेटा-थीम लेटर (ए-जी) फुटर का थीम रंग निर्धारित करता है।मूलत: "a" है。

टिप्पणी:यदि आवर्ती दृश्य स्थान को सक्षम करना है तो data-position="fixed" का उपयोग करें और इस एलीमेंट को data-fullscreen गुण जोड़ें。

हेडर

data-role="header" के कंटेनर

डेटा एट्रिब्यूट मूल्य वर्णन
data-id sometext एकल आईडी निर्धारित करता है।स्थायी हेडर के लिए आवश्यक है。
data-position इनलाइन | फिक्स्ड हेडर और पृष्ठ सामग्री के बीच इनलाइन या शीर्ष पर रहने के लिए निर्धारित करता है。
data-fullscreen ट्रू | फॉल्स पृष्ठ को हमेशा शीर्ष पर रखता है और पृष्ठ सामग्री को ओवरले करता है (कुछ हद तक पारदर्शी)。
डेटा-थीम लेटर (ए-जी) हेडर का थीम रंग निर्धारित करता है।मूलत: "a" है。

टिप्पणी:यदि आवर्ती दृश्य स्थान को सक्षम करना है तो data-position="fixed" का उपयोग करें और इस एलीमेंट को data-fullscreen गुण जोड़ें。

लिंक

सभी लिंक, data-role="button" के लिंक और फॉर्म सबमिट बटन सहित。

डेटा एट्रिब्यूट मूल्य वर्णन
data-ajax ट्रू | फॉल्स AJAX के माध्यम से पृष्ठ को लोड करने के लिए निर्धारित करता है कि क्या यह उपयोगकर्ता अनुभव को सुधारे और ट्रांसीशन को बेहतर बनाए।यदि यह false सेट किया गया है तो jQuery Mobile सामान्य पृष्ठ अनुरोध करेगा。
data-direction पलटता ट्रांसीशन एनीमेशन पलटता (केवल पृष्ठ या डायलॉग के लिए)
data-dom-cache ट्रू | फॉल्स विन्यास को निष्क्रिय करने के लिए data-dom-cache को निर्धारित करें। यदि इसे true के रूप में सेट किया गया है, तो आपको DOM का प्रबंधन करना चाहिए और सभी मोबाइल डिवाइसों पर पूर्ण परीक्षण करें।
data-prefetch ट्रू | फॉल्स DOM में पृष्ठ को पूर्व-अवलोकन करने के लिए निर्धारित करता है कि क्या यह उपयोगकर्ता की यात्रा पर उपलब्ध होगा।
data-rel पीछे | डायलॉग | बाहरी | पूप लिंक के व्यवहार के लिए विकल्प निर्धारित करता है。 पीछे - इतिहास रिकॉर्ड में पीछे की ओर एक कदम बढ़ाता है。 डायलॉग - पृष्ठ को डायलॉग के रूप में खोलता है और इसे इतिहास में नहीं दर्ज करता है。 बाहरी - दूसरे डोम को लिंक करता है。 खोलता है - बाहरी दृश्य में उभरता है।
data-transition fade | flip | flow | pop | slide | slidedown | slidefade | slideup | turn | none एक पृष्ठ से दूसरे पृष्ठ पर जाने के तरीके को निर्धारित करें। jQuery Mobile ट्रांसीशन को देखें।
data-position-to origin | jQuery selector | window उभरती हुई बॉक्स का स्थान निर्धारित करें। मूल - डिफ़ॉल्ट।इसके लिंक को खोलने पर बाहरी दृश्य में उभरता है。 jQuery selector - निर्दिष्ट एलीमेंट पर उभरता है। विंडो - विंडो स्क्रीन के मध्य में उभरता है।

सूची

data-role="listview" अभियान वाले <ol> या <ul>।

डेटा एट्रिब्यूट मूल्य वर्णन
data-autodividers ट्रू | फॉल्स सूची आइटम को स्वचालित रूप से विभाजित करने का निर्धारित करता है।
data-count-theme लेटर (ए-जी) गणना बब के थीम का रंग निर्धारित करता है। मूलभूत रूप से "c" है।
data-divider-theme लेटर (ए-जी) सूची विभाजक के थीम का रंग निर्धारित करता है। मूलभूत रूप से "b" है।
data-filter ट्रू | फॉल्स सूची में सर्च फ़ोल्डर जोड़े जाने का निर्धारित करता है।
data-filter-placeholder sometext सर्च फ़ोल्डर में पाठ को निर्धारित करता है। मूलभूत रूप से "Filter items..." है।
data-filter-theme लेटर (ए-जी) सर्च फिल्टर के थीम का रंग निर्धारित करता है। मूलभूत रूप से "c" है।
data-icon Icons Reference सूची के आइकन को निर्धारित करता है。
data-inset ट्रू | फॉल्स सूची को गोलाकार और मार्गदर्शन शैली जोड़े जाने का निर्धारित करता है।
data-split-icon Icons Reference विभाजन बटन के आइकन को निर्धारित करता है। मूलभूत रूप से "arrow-r" है।
data-split-theme लेटर (ए-जी) विभाजन बटन के थीम का रंग निर्धारित करता है। मूलभूत रूप से "b" है।
डेटा-थीम लेटर (ए-जी) सूची के थीम का रंग निर्धारित करता है。

सूची आइटम

data-role="listview" अभियान वाले <ol> या <ul> के भीतर <li>।

डेटा एट्रिब्यूट मूल्य वर्णन
data-filtertext sometext फिल्टर तत्व पर चार्ज किए जाने वाले पाठ को निर्धारित करता है। यह पाठ वास्तविक सूची आइटम के पाठ के बजाय चार्ज किया जाएगा।
data-icon Icons Reference सूची आइकन को निर्धारित करता है。
डेटा-रोल list-divider सूची विभाजक को निर्धारित करता है。
डेटा-थीम लेटर (ए-जी) सूची आइटम के थीम का रंग निर्धारित करता है。

टिप्पणी:data-icon अभियान केवल लिंक वाले सूची आइटम के लिए उपयोगी है।

नेवबार

data-role="navbar" अभियान वाले विन्यास के भीतर <li> एलीमेंट।

डेटा एट्रिब्यूट मूल्य वर्णन
data-icon Icons Reference सूची आइकन को निर्धारित करता है。
data-iconpos बाईं | दायाँ | ऊपर | नीचे | notext चिह्न का स्थान को निर्धारित करता है。

सूचना:नेविगेशन बार अपने माता डोमेन से theme-swatch को विरासत करता है। नेविगेशन बार को data-theme अभियान को सेट करना असंभव है। data-theme अभियान को नेविगेशन बार के हर लिंक में सलाना जा सकता है।

पेज

data-role="page" अभियान के साथ विन्यास के भीतर वाला डोमेन।

डेटा एट्रिब्यूट मूल्य वर्णन
data-add-back-btn ट्रू | फॉल्स स्वचालित रूप से पिछला बटन जोड़ता है, केवल पैट्टर्न में उपयोग में है。
data-back-btn-text sometext पिछला बटन के पाठ को निर्धारित करता है。
data-back-btn-theme लेटर (ए-जी) पिछला बटन के थीम का रंग निर्धारित करता है。
data-close-btn-text लेटर (ए-जी) बातचीत पर बंद बटन के पाठ को निर्धारित करता है。
data-dom-cache ट्रू | फॉल्स विन्यास को निष्क्रिय करने के लिए data-dom-cache को निर्धारित करें। यदि इसे true के रूप में सेट किया गया है, तो आपको DOM का प्रबंधन करना चाहिए और सभी मोबाइल डिवाइसों पर पूर्ण परीक्षण करें।
data-overlay-theme लेटर (ए-जी) वार्तापत्र पृष्ठ का अधिकार (पृष्ठभूमि) रंग निर्धारित करें।
डेटा-थीम लेटर (ए-जी) पृष्ठ का विषय का रंग निर्धारित करें। डिफ़ॉल्ट "c" है।
data-title sometext पृष्ठ का शीर्षक निर्धारित करें।
data-url url इस मान्डे को URL अद्यतन करने के लिए उपयोग किया जाता है, नहीं कि पृष्ठ की अनुरोध के लिए।

Popup

data-role="popup" अभियान के साथ बांधे हुए कंटेनर:

डेटा एट्रिब्यूट मूल्य वर्णन
data-corners ट्रू | फॉल्स उभरती हुई बॉक्स का गोलाकार होने का निर्धारण करें।
data-overlay-theme लेटर (ए-जी) उभरती हुई बॉक्स का अधिकार (पृष्ठभूमि) रंग निर्धारित करें। डिफ़ॉल्ट पारदर्शी पृष्ठभूमि (none) है।
data-shadow ट्रू | फॉल्स उभरती हुई बॉक्स का छाया होने का निर्धारण करें।
डेटा-थीम लेटर (ए-जी) उभरती हुई बॉक्स का विषय का रंग निर्धारित करें। डिफ़ॉल्ट "none" गोला रंग है।
data-tolerance 30, 15, 30, 15 विंडो किनारे (top, right, bottom, left) से दूरी (30, 15, 30, 15)

data-rel="popup" अभियान के साथ बांधे हुए एंड्रोइड:

डेटा एट्रिब्यूट मूल्य वर्णन
data-position-to origin | jQuery selector | window उभरती हुई बॉक्स का स्थान निर्धारित करें। Origin - डिफ़ॉल्ट। उभरती हुई बॉक्स उस लिंक पर होगी जिसे खोला गया है। jQuery selector - उभरती हुई बॉक्स निर्दिष्ट एलीमेंट पर होगी। विंडो - उभरती हुई बॉक्स विंडो स्क्रीन के केंद्र में होगी।
data-rel popup खोलने के लिए उभरती हुई बॉक्स के लिए उपयोग किया जाता है।
data-transition fade | flip | flow | pop | slide | slidedown | slidefade | slideup | turn | none एक पृष्ठ से दूसरे पृष्ठ पर जाने के तरीके को निर्धारित करें। jQuery Mobile ट्रांसीशन को देखें।

रेडियो बटन

label और type="radio" के input के लिए प्रतिक्रिया स्वचालित रूप से बटन शैली में सेट कर दी जाएगी, data-role की आवश्यकता नहीं है।

डेटा एट्रिब्यूट मूल्य वर्णन
डेटा-मिनी ट्रू | फॉल्स बटन को छोटे या सामान्य आकार का होने का निर्धारण करें।
डेटा-रोल नहीं jQuery Mobile को एकल रेडियो बटन को उन्नत बटन के शैली में रखने के लिए रखें।
डेटा-थीम लेटर (ए-जी) एकल रेडियो बटन का विषय का रंग निर्धारित करें।

सूचना:अगर अनेक एकल रेडियो बटन को समझौता करना है, तो data-role="controlgroup" और data-type="horizontal|vertical" का उपयोग करके बटन को लचीला या ऊर्ध्वाधर के रूप में समझौता करें।

Select

सभी <select> एलीमेंट। स्वचालित रूप से बटन स्टाइल को निर्धारित किया जाएगा, data-role की आवश्यकता नहीं है。

डेटा एट्रिब्यूट मूल्य वर्णन
data-icon Icons Reference select एलीमेंट के चिह्न को निर्धारित करता है। मूलभूत रूप से "arrow-d" है。
data-iconpos बाईं | दायाँ | ऊपर | नीचे | notext चिह्न का स्थान को निर्धारित करता है。
data-inline ट्रू | फॉल्स select एलीमेंट को इनलाइन करने का निर्धारित करता है。
डेटा-मिनी ट्रू | फॉल्स select एलीमेंट को छोटे या साधारण आकार का क्या होना है को निर्धारित करता है。
data-native-menu ट्रू | फॉल्स यदि false के रूप में सेट किया जाता है, तो jQuery के अपने अनुकूलित चयन मेनू का उपयोग किया जाएगा (यदि आप चयन मेनू को सभी मोबाइल उपकरणों पर एकसमान आकार चाहते हैं, तो इसका सुझाव दिया जाता है)。
data-overlay-theme लेटर (ए-जी) jQuery अनुकूलित चयन मेनू के थीम रंग को निर्धारित करता है (data-native-menu="false" के साथ उपयोग करें)。
data-placeholder ट्रू | फॉल्स गैर-अस्थायी select के <option> एलीमेंट पर सेट किया जा सकता है。
डेटा-रोल नहीं jQuery Mobile को select एलीमेंट को बटन स्टाइल को लगाता है。
डेटा-थीम लेटर (ए-जी) select एलीमेंट के थीम रंग को निर्धारित करता है。

सूचना:कई select एलीमेंट को जोड़ने के लिए data-role="controlgroup" और data-type="horizontal|vertical" का उपयोग करें ताकि इस एलीमेंट को आड़ा या ऊर्ध्वाधर रूप से जोड़ा जाए।

Slider

type="range" का input एलीमेंट होगा. स्वचालित रूप से बटन स्टाइल को निर्धारित किया जाएगा, data-role की आवश्यकता नहीं है。

डेटा एट्रिब्यूट मूल्य वर्णन
data-highlight ट्रू | फॉल्स स्लाइडर ट्रैक को हाइलाइट करने का निर्धारित करता है。
डेटा-मिनी ट्रू | फॉल्स स्लाइडर को छोटे या साधारण आकार का क्या होना है को निर्धारित करता है。
डेटा-रोल नहीं jQuery Mobile को स्लाइडर सेटिंग बटन के स्टाइल को लगाता है。
डेटा-थीम लेटर (ए-जी) स्लाइडर कंट्रोल (input, handle और track) के थीम रंग को निर्धारित करता है。
data-track-theme लेटर (ए-जी) स्लाइडर ट्रैक के थीम रंग को निर्धारित करता है。

Text input & Textarea

type="text|search|etc." का input एलीमेंट या textarea एलीमेंट होगा. स्वचालित रूप से स्टाइल निर्धारित किया जाएगा, data-role की आवश्यकता नहीं है。

डेटा एट्रिब्यूट मूल्य वर्णन
डेटा-मिनी ट्रू | फॉल्स इनपुट एलीमेंट को छोटे या सामान्य आकार का होने का प्रतिपादन करता है。
डेटा-रोल नहीं जक्वेरी मोबाइल को input/textarea को बटन की शैली में सेट करने के लिए डाला जाता है。
डेटा-थीम लेटर (ए-जी) इनपुट फील्ड के थीम का रंग निर्धारित करता है。