jqueryMobile初始化组件

http://hi.baidu.com/html5css3/item/80abde1703b3fef1746a844a

数据属性速查 Data- attribute reference(点击标题可进入详细介绍页面)Jquery mobile框架使用html5的 data- 属性来使初始化标记和配置组件。这些属性全部都是可选的,并且支持手动调用插件。为了避免命名上的和与其他也使用html5的 data- 属性插件与框架的冲突,可以使用全局设置来自定义命名空间。

按钮

通过 data-role="button" 来标记按钮。基于链接的按钮和表单的button元素会被自动渲染,无需data-role属性。data-cornerstrue | falsedata-iconhome | delete | plus | arrow-u | arrow-d | check | gear | grid | star | custom | arrow-r | arrow-l | minus | refresh | forward | back | alert | info | searchdata-iconposleft | right | top | bottom | notextdata-iconshadowtrue | falsedata-inlinetrue | falsedata-shadowtrue | falsedata-themeswatch letter (a-z)
多个按钮按钮的情况下,可以给这些按钮的容器添加data-role="controlgroup"属性,使这些按钮成为垂直的按钮组。给按钮添加data-type="horizontal" 属性可以使按钮水平并排排列。

复选框

通过type="checkbox"标记的input元素会自动增强,无需data-role属性。data-rolenone (防止自动增强)data-theme主题样式(a-z) - 添加到表单元素上

可折叠区域

一个标题元素和一个用data-role="collapsible"属标记的容器。data-collapsedtrue | falsedata-content-theme主题样式 (a-z)data-theme主题样式 (a-z)

手风琴组

一个标题元素和一个用data-role="collapsible-set"属标记的容器。data-content-theme主题样式 (a-z) - Sets all collapsibles in setdata-theme主题样式r (a-z) - Sets all collapsibles in set

对话框

data-role="page"属性标记的容器或者通过data-rel="dialog"标记的链接所指向的容器data-close-btn-textstring (对话框的关闭按钮的文字)data-dom-cachetrue | falsedata-id字符串 (页面的ID)data-fullscreentrue | false (used in conjunction with fixed toolbars)data-overlay-theme主题样式 (a-z) - 页面弹出对话框的时候蒙版的主题data-theme主题样式 (a-z)data-titlestring (此页面显示的时候的标题)

页面内容

data-role="content"属性标记的容器data-theme主题样式 (a-z)

Field container

data-role="fieldcontain"属性标记的容器

开关

data-role="slider"属性标记的列表菜单,只能有两个option.data-role无 (防止自动增强l)data-theme主题样式 (a-z) - 给表单元素添加主题样式data-track-theme主题样式 (a-z) - 给表单元素添加主题样式

footer

data-role="footer"属性标记的容器data-id字符串 (unique id, useful in persistent footers)data-positionfixeddata-theme主题样式(a-z)

Header

data-role="header"属性标记的容器data-add-back-btntrue | false (只会在header自动添加后退按钮)data-back-btn-text字符串data-back-btn-theme主题样式 (a-z)data-positionfixeddata-theme主题样式 (a-z)data-title字符串 (title used when page is shown)


原文地址:https://www.cnblogs.com/danghuijian/p/4400002.html