jQuery Mobile Data 属性
jQuery Data 属性
jQuery Mobile 使用 HTML5 data-* 属性来为移动设备创建更具触摸友好性和吸引性的外观。
在下面的参考列表中,粗体显示的值为默认值。
按钮
在1.4 版本以后已废弃。使用
CSS 类 替代。带有 data-role="button" 的超链接。button 元素、工具栏中的链接以及 input 字段都会自动渲染成按钮样式,不需要添加 data-role="button"。
Data-属性 |
值 |
描述 |
data-corners |
true | false |
规定按钮是否圆角 |
data-icon |
图标参考手册 |
规定按钮的图标。默认没有图标。 |
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 |
字母 (a-z) |
规定按钮的主题颜色 |
|
如需组合多个按钮,请使用带有 data-role="controlgroup" 属性和 data-type="horizontal|vertical" 的容器来规定是否水平或垂直组合按钮。 |
复选框
带有 type="checkbox" 的成双成对的 label 和 input。它们会被自动渲染成按钮样式,data-role 不是必需的。
Data-属性 |
值 |
描述 |
data-mini |
true | false
|
规定复选框是小尺寸还是常规尺寸 |
data-role |
none |
防止 jQuery Mobile 把复选框渲染成按钮样式 |
data-theme |
字母 (a-z) |
规定复选框的主题颜色 |
|
如需组合多个复选框,请使用带有 data-role="controlgroup" 属性和 data-type="horizontal|vertical" 的容器来规定是否水平或垂直组合复选框。 |
可折叠块
在带有 data-role="collapsible" 的容器内部的后跟任意 HTML 标记的标题元素。
Data-属性 |
值 |
描述 |
data-collapsed |
true | false |
规定内容是折叠还是展开 |
data-collapsed-icon |
图标参考手册 |
规定可折叠按钮的图标。默认是 "plus" |
data-content-theme |
字母 (a-z) |
规定可折叠内容的主题颜色。是否为可折叠内容添加圆角 |
data-expanded-icon |
图标参考手册 |
规定当内容展开时可折叠按钮的图标。默认是 "minus" |
data-iconpos |
left | right | top | bottom |
规定图标的位置 |
data-inset |
true | false |
规定可折叠按钮是否渲染成圆角且带外边距 |
data-mini |
true | false
|
规定可折叠按钮是小尺寸还是常规尺寸 |
data-theme |
字母 (a-z) |
规定可折叠按钮的主题颜色 |
可折叠集合
在带有 data-role="collapsible-set" 的容器内部的可折叠内容块。
Data-属性 |
值 |
描述 |
data-collapsed-icon |
图标参考手册 |
规定可折叠按钮的图标。默认是 "plus" |
data-content-theme |
字母 (a-z) |
规定可折叠按钮的主题颜色 |
data-expanded-icon |
图标参考手册 |
规定当内容展开时可折叠按钮的图标。默认是 "minus" |
data-iconpos |
left | right | top | bottom | notext |
规定图标的位置 |
data-inset |
true | false |
规定可折叠块是否渲染成圆角且带外边距 |
data-mini |
true | false
|
规定可折叠按钮是小尺寸还是常规尺寸 |
data-theme |
字母 (a-z) |
规定可折叠集合的主题颜色 |
内容
在 1.4 版本已废弃, 1.5 版本后不再支持。 使用 data-role="content" 的容器。
Data-属性 |
值 |
描述 |
data-theme |
字母 (a-z) |
规定内容的主题颜色。 |
控件组
带有 data-role="controlgroup" 的
或