HTML5data属性说明.docx
《HTML5data属性说明.docx》由会员分享,可在线阅读,更多相关《HTML5data属性说明.docx(9页珍藏版)》请在冰豆网上搜索。
![HTML5data属性说明.docx](https://file1.bdocx.com/fileroot1/2023-1/7/c7dc60a4-e197-43e4-aa01-6a655c8fdce1/c7dc60a4-e197-43e4-aa01-6a655c8fdce11.gif)
HTML5data属性说明
Dataattributereference
ThejQueryMobileframeworkusesHTML5data-attributestoallowformarkup-basedinitializationandconfigurationofwidgets.Theseattributesarecompletelyoptional;callingpluginsmanuallyandpassingoptionsdirectlyisalsosupported.Toavoidnamingconflictswithotherpluginsorframeworksthatalsousedata-attributes,setacustomnamespacebymodifyingthe.
Linkswithdata-role="button".Input-basedbuttons,linksintoolbarsandbuttonelementsareauto-enhanced,nodata-rolerequired.
data-corners
true|false
data-icon
home|delete|plus|arrow-u|arrow-d|check|gear|grid|star|custom|arrow-r|arrow-l|minus|refresh|forward|back|alert|info|search
data-iconpos
left|right|top|bottom|notext
data-iconshadow
true|false
data-inline
true|false
data-mini
true|false-Compactsizedversion
data-shadow
true|false
data-theme
swatchletter(a-z)
Multiplebuttonscanbewrappedinacontainerwithadata-role="controlgroup"attributeforaverticallygroupedset.Addthedata-type="horizontal"attributeforthebuttonstositside-by-side.Addthedata-mini="true"togetthemini/compactsizedversionforallthebuttonsthatappearinthecontrolgroup.
Pairsoflabelsandinputswithtype="checkbox"areauto-enhanced,nodata-rolerequired
data-mini
true|false-Compactsizedversion
data-role
none-Preventsauto-enhancementtousenativecontrol
data-theme
swatchletter(a-z)-Addedtotheformelement
Multiplecheckboxescanbewrappedinacontainerwithadata-role="controlgroup"attributeforaverticallygroupedset.Addthedata-type="horizontal"attributeforthecheckboxestositside-by-side.Addthedata-mini="true"togetthemini/compactsizedversionforallthecheckboxesthatappearinthecontrolgroup.
Aheadingandcontentwrappedinacontainerwiththedata-role="collapsible"
data-collapsed
true|false
data-collapsed-icon
home|delete|plus|arrow-u|arrow-d|check|gear|grid|star|custom|arrow-r|arrow-l|minus|refresh|forward|back|alert|info|search
data-content-theme
swatchletter(a-z)
data-expanded-icon
home|delete|plus|arrow-u|arrow-d|check|gear|grid|star|custom|arrow-r|arrow-l|minus|refresh|forward|back|alert|info|search
data-iconpos
left|right|top|bottom
data-inset
true|false
data-mini
true|false-Compactsizedversion
data-theme
swatchletter(a-z)
Anumberofcollapsibleswrappedinacontainerwiththedata-role="collapsible-set"
data-collapsed-icon
home|delete|plus|arrow-u|arrow-d|check|gear|grid|star|custom|arrow-r|arrow-l|minus|refresh|forward|back|alert|info|search
data-content-theme
swatchletter(a-z)-Setsallcollapsiblesinset
data-expanded-icon
home|delete|plus|arrow-u|arrow-d|check|gear|grid|star|custom|arrow-r|arrow-l|minus|refresh|forward|back|alert|info|search
data-iconpos
left|right|top|bottom|notext
data-inset
true|false
data-mini
true|false-Compactsizedversion
data-theme
swatchletter(a-z)-Setsallcollapsiblesinset
Containerwithdata-role="content"
data-theme
swatchletter(a-z)
DIVorFIELDSETcontainerwithdata-role="controlgroup".Visuallyintegratemultiplebutton-styledinputsofasingletype(,,,)intoagroup.Forgroupingformcheckboxesandradiobuttons,thefieldsetcontainerisrecommendedinsideadivcontainerwiththedata-role="fieldcontain",toimprovelabelstyling.
data-mini
true|false-Compactsizedversionforallitemsinthecontrolgroup
data-type
horizontal|vertical-Forhorizontalorverticalitemalignment
Containerwithdata-role="dialog"orlinkedtowithdata-rel="dialog"ontheanchor.
data-close-btn-text
string-Textfortheclosebutton,dialogonly
data-dom-cache
true|false
data-overlay-theme
swatchletter(a-z)-Overlaythemewhenthepageisopenedinadialog
data-theme
swatchletter(a-z)
data-title
string-Titleusedwhenpageisshown
Containerwithdata-enhance="false"ordata-ajax="false"
data-enhance
true|false
data-ajax
true|false
AnyDOMelementsinsideadata-enhance="false"container,savefordata-role="page|dialog"elements,willbeignoredduringinitialenhancementandsubsequentcreateeventsprovidedthatthe$.flagissetpriortotheenhancement(eginamobileinitbinding).
Anylinkorformelementinsidedata-ajax="false"containerswillbeignoredbytheframework'snavigationfunctionalitywhen$.issettotrue.
Containerwithdata-role="fieldcontain"wrappedaroundlabel/formelementpair
Containerwithdata-role="header"ordata-role="footer"plustheattributedata-position="fixed"
data-disable-page-zoom
true|false-User-scaling-abilityforpageswithfixedtoolbars
data-fullscreen
true|false-Settingtoolbarsoverthepage-content
data-tap-toggle
true|false-Abilitytotoggletoolbar-visibilityonusertap/click
data-transition
slide|fade|none-Show/hide-transitionwhenatap/clickoccurs
data-update-page-padding
true|false-Havethepagetopandbottompaddingupdatedonresize,transition,"updatelayout"events(theframeworkalwaysupdatesthepaddingonthe"pageshow"event).
data-visible-on-page-show
true|false-Toolbar-visibilitywhenparentpageisshown
Selectwithdata-role="slider"andtwooptionelement
data-mini
true|false-Compactsizedversion
data-role
none-Preventsauto-enhancementtousenativecontrol
data-theme
swatchletter(a-z)-Addedtotheformelement
data-track-theme
swatchletter(a-z)-Addedtotheformelement
Containerwithdata-role="footer"
data-id
string-UniqueID.Requiredforpersistentfooters
data-position
fixed
data-fullscreen
true|false-Usedinconjunctionwithfixedtoolbars
data-theme
swatchletter(a-z)
Containerwithdata-role="header"
data-id
string-UniqueID.Requiredforpersistentheaders
data-position
fixed
data-fullscreen
true|false-Usedinconjunctionwithfixedtoolbars
data-theme
swatchletter(a-z)
Links,includingthosewithadata-role="button",andformsubmitbuttonssharetheseattributes
data-ajax
true|false
data-direction
reverse-Reversetransitionanimation(onlyforpageordialog)
data-dom-cache
true|false
data-prefetch
true|false
data-rel
back-Tomoveonestepbackinhistory
dialog-Toopenlinkstyledasdialog,nottrackedinhistory
external-Forlinkingtoanotherdomain
popup-Foropeningapopup
data-transition
fade|flip|flow|pop|slide|slidedown|slidefade|slideup|turn|none
data-position-to
origin-Centersthepopupoverthelinkthatopensit
jQueryselector-Centersthepopupoverthespecifiedelement
window-Centersthepopupinthewindow
Note:
optiononlyavailablewhenusedwithpopups.Seealso:
popup.
OLorULwithdata-role="listview"
data-autodividers
true|false
data-count-theme
swatchletter(a-z)-Default"c"
data-divider-theme
swatchletter(a-z)-Default"b"
data-filter
true|false
data-filter-placeholder
string
data-filter-theme
swatchletter(a-z)
data-header-theme
swatchletter(a-z)
data-inset
true|false
data-split-icon
home|delete|plus|arrow-u|arrow-d|check|gear|grid|star|custom|arrow-r|arrow-l|minus|refresh|forward|back|alert|info|search
data-split-theme
swatchletter(a-z)-Default"b"
data-theme
swatchletter(a-z)
LIwithinalistview
data-filtertext
string-Filterbythisvalueinsteadofinnertext
data-icon
home|delete|plus|arrow-u|arrow-d|check|gear|grid|star|custom|arrow-r|arrow-l|minus|refresh|forward|back|alert|info|search|false
data-role
list-divider
data-theme
swatchletter(a-z)
Thedata-iconattributeisonlyapplicableforalistviewitemifitcontainsalink.
AnumberofLIswrappedinacontainerwithdata-role="navbar"
data-iconpos
left|right|top|bottom|notext
Toaddiconstothenavbaritems,thedata-iconattributeisused,specifyingastandardmobileiconforeachitem.
Navbarsinheritthetheme-swatchfromtheirparentcontainer.Settingthedata-themeattributetoanavbarisnotsupported.Thedata-themeattributecanbesetindividuallytothelinksinsideanavbar.
Containerwithdata-role="page"
data-add-back-btn
true|false-Autoaddbackbutton,headeronly
data-back-btn-text
string
data-back-btn-theme
swatchletter(a-z)
data-close-btn-text
string-Textfortheclosebutton,dialogonly
data-dom-cache
true|false
data-fullscreen
true|false-Usedinconjunctionwithfixedtoolbars
Deprecatedin-useonheaderandfooterinstead.
data-overlay-theme
swatchletter(a-z)-Overlaythemewhenthepageisopenedinadialog
data-theme
swatchletter(a-z)-Default"c"
data-title
string-Titleusedwhenpageisshown
data-url
url-ValueforupdatingtheURL,insteadoftheurlusedtorequestthepage
Containerwithdata-role="popup"
data-corners
true|false
data-overlay-theme
swatchletter(a-z)-Default"null"(transparentbackground)
data-shadow
true|false
data-theme
swatchletter(a-z)|none-Defaultinherited,"none"setsthepopuptotransparent
data-tolerance
30,15,30,15-Distancefromtheedgesofthewindow(top,right,bottom,left)
Anchorwithadata-rel="popup"opensthepopup
data-position-to
origin-Centersthepopupoverthelinkthatopensit
jQueryselector-Centersthepopupoverthespecifiedelement
window-Centersthepopupinthewindow
data-rel
popup-Foropeningapopup
data-transition
fade|flip|flow|pop|slide|slidedown|slidefade|slideup|turn|none-Thetransit