Latest web development tutorials

Propiedades jQuery Mobile Data

Propiedades de datos jQuery

jQuery Mobile usando HTML5 de datos * atributos para crear una apariencia más tacto agradable y de atracción para los dispositivos móviles.

Valor de referencia en la lista siguiente, en negrita son los valores por defecto.


pulsador

Después de la versión 1.4 es obsoleta. Utilice la clase CSS en su lugar. Hipervínculo con datos en función = "botón" de. botón de la barra de herramientas vínculos elemento y campos de entrada automáticamente mostrará estilo de botón, no es necesario añadir el botón "" data-role =.

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) 规定按钮的主题颜色

lámpara Para una combinación de una pluralidad de botones, use = "grupo control" y de tipo de datos = atributo con data-role "horizontal | vertical" contenedor para especificar si las combinaciones horizontales o verticales de botones.


caja

Con pares de etiqueta y input type = "checkbox" de. Ellos están prestando automáticamente estilo del botón de proceso, no se requiere de datos en papel.

Data-属性 描述
data-mini true | false 规定复选框是小尺寸还是常规尺寸
data-role none 防止 jQuery Mobile 把复选框渲染成按钮样式
data-theme 字母 (a-z) 规定复选框的主题颜色

lámpara Para combinar varias casillas de verificación, use = "grupo control" y de tipo de datos = atributo con data-role "horizontal | vertical" contenedor para especificar si la casilla de verificación combinaciones horizontales o verticales.


bloque colapsable

En el interior del recipiente seguido por cualquier HTML con una función de datos = "plegable" marca el elemento título.

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) 规定可折叠按钮的主题颜色


colección plegable

En el interior del recipiente con el data-role = "colapsable-set " del bloque de contenido plegable.

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) 规定可折叠集合的主题颜色


contenido

En la versión 1.4 ha sido abandonado después de la versión 1.5 ya no es compatible. Utilizando datos-role = "contenido" del contenedor.

propiedad de datos valor descripción
datos en el tema Letras (az) Las disposiciones relativas al contenido de color.


El grupo de control

Con los datos en roles = "grupo control" del <div> <fieldset> contenedor o. Una combinación de un solo tipo (botones basadas en enlaces, botones de radio, casillas de verificación, seleccione los elementos) de una pluralidad de estilo botones de entrada. Para las combinaciones forman casillas de verificación y botones de radio, se recomienda el <fieldset> en un recipiente con un data-role = "fieldcontain" la etiqueta <div> en el interior para mejorar el estilo.

Data-属性 描述
data-mini true | false 规定控件组是小尺寸还是常规尺寸
data-type horizontal | vertical 规定控件组是水平显示还是垂直显示


diálogo

Contenedor o con-rel = enlace de datos "diálogo" con data-role = "diálogo" es.

Data-属性 描述
data-close-btn-text sometext 规定对话框关闭按钮的文本
data-dom-cache true | false 规定是否清除各个页面的 jQuery DOM 缓存(如果设置为 true,您必须自己管理 DOM 并在所有移动设备上进行测试)
data-overlay-theme 字母 (a-z) 规定对话框页面的蒙版(背景)颜色
data-theme 字母 (a-z) 规定对话框页面的主题颜色
data-title sometext 规定对话框页面的标题


aumentar

Con = "false" o datos ajax = contenedores de datos-mejorar "falsos".

Data-属性 描述
data-enhance true | false 如果设置为 "true"(默认),jQuery Mobile 会自动渲染页面,使其更适合于移动设备。如果设置为 "false",框架将不会渲染页面
data-ajax true | false 规定是否通过 ajax 加载页面

Nota: Los datos de mejorar-= "false" debe ser $ .mobile.ignoreContentEnabled = true "que se utiliza en conjunto para prevenir jQuery Mobile representar la página automáticamente.

Cuando $ .mobile.ignoreContentEnabled establece en verdadero marco de navegación, datos ajax = serán ignorados "falsos" los enlaces o elementos de formulario dentro del contenedor.


contenedor de dominio

1.4 versión ha sido abandonado después de la versión 1.5 ya no es compatible, se utilizará la clase = "interfaz de usuario alternativa-fieldcontain." Envuelto en una etiqueta / forma pares de elementos y data-role = "fieldcontain" recipiente con.


barra de herramientas acoplada

Con los datos en roles = "header" o data-role = "pie", y la posición de datos = "fija" con propiedades de contenedores.

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 和 "updatelayout" 事件发生时更新(jQuery Mobile 在 "pageshow" 事件发生时总是更新内边距)
data-visible-on-page-show true | false 规定当父页面显示时工具栏的可见性


Activa el interruptor de palanca

Un data-role = "deslizante" con el elemento <select> con dos elementos <option>.

Data-属性 描述
data-mini true | false 规定开关是小尺寸还是常规尺寸
data-role none 防止 jQuery Mobile 把拨动开关渲染成按钮样式
data-theme 字母 (a-z) 规定拨动开关的主题颜色
data-track-theme 字母 (a-z) 规定轨道的主题颜色


barra de cola

Data-role = contenedor de "pie" con.

Data-属性 描述
data-id sometext 规定唯一 ID。对于持续的尾部栏是必需的
data-position inline | fixed 规定尾部栏是与页面内容内联还是保持固定在底部
data-fullscreen true | false 规定尾部栏是固定在底部还是覆盖在页面内容上(查看范围更大)
data-theme 字母 (a-z) 规定尾部栏的主题颜色。默认是 "a"

Nota: Para permitir el posicionamiento de pantalla completa, utilice la posición de datos = "fijo", y luego añadir el atributo de datos en pantalla completa al elemento.


Head Bar

Data-role = "header" del recipiente con.

Data-属性 描述
data-id sometext 规定唯一 ID。对于持续的头部栏是必需的
data-position inline | fixed 规定头部栏是与页面内容内联还是保持固定在顶部
data-fullscreen true | false 规定头部栏是固定在顶部还是覆盖在页面内容上(查看范围更大)
data-theme 字母 (a-z) 规定头部栏的主题颜色。默认是 "a"

Nota: Para permitir el posicionamiento de pantalla completa, utilice la posición de datos = "fijo", y luego añadir el atributo de datos en pantalla completa al elemento.


enlace

Todos los enlaces, incluyendo los enlaces y formularios con data-role = "botón" botón de envío.

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 - 用于链接到另一个域。Popup - 打开一个弹出窗口。
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 - 定位弹窗在窗口屏幕的中央。


lista

Con los datos en roles = "vista de lista" de <ol> o <ul>.

Data-属性 描述
data-autodividers true | false 规定是否自动划分列表项
data-count-theme 字母 (a-z) 规定计数气泡的主题颜色。
data-divider-theme 字母 (a-z) 规定列表分隔的主题颜色。
data-filter true | false 规定是否在列表中添加搜索框
data-filter-placeholder sometext 1.4 版本后废弃。使用 HTML placeholder 属性替代。规定搜索框内的文本。默认是 "Filter items..."
data-filter-theme 字母 (a-z) 规定搜索过滤的主题颜色。
data-icon 图标参考手册 规定列表的图标
data-inset true | false 规定列表是否渲染成圆角且带外边距
data-split-icon 图标参考手册 规定分割按钮的图表。默认是 "arrow-r"
data-split-theme 字母 (a-z) 规定分割按钮的主题颜色。
data-theme 字母 (a-z) 规定列表的主题颜色


elementos de la lista

Con los datos en roles = "vista de lista" de <ol> o <ul> en el <li>.

Data-属性 描述
data-filtertext sometext 规定当过滤元素时要搜索的文本。该文本将会被过滤,而不是实际的列表项文本
data-icon 图标参考手册 规定列表项图标
data-role list-divider 规定列表项的分隔
data-theme 字母 (a-z) 规定列表项的主题颜色

Nota: Los datos en iconos atributo sólo afecta al elemento de la lista con un enlace.


Barra de navegación

Con-función de datos interna = "navbar" <li> elemento contenedor.

Data-属性 描述
data-icon 图标参考手册 规定列表项的图标
data-iconpos left | right | top | bottom | notext 规定图标的位置

lámpara Muestra la barra de navegación de temas heredado de su padre. El atributo-tema de datos barra de navegación establecido no es posible. atributo de datos-tema se puede ajustar de forma individual para cada enlace en la barra de navegación.


página

Data-role = "página" del recipiente con.

Data-属性 描述
data-add-back-btn true | false 自动添加后退按钮,仅限头部栏
data-back-btn-text sometext 规定后退按钮的一些文本
data-back-btn-theme 字母 (a-z) 规定后退按钮的主题颜色
data-close-btn-text 字母 (a-z) 规定对话框上关闭按钮的一些文本
data-dom-cache true | false 规定是否清除各个页面的 jQuery DOM 缓存(如果设置为 true,您必须自己管理 DOM 并在所有移动设备上进行测试)
data-overlay-theme 字母 (a-z) 规定对话框页面的蒙版(背景)颜色
data-theme 字母 (a-z) 规定页面的主题颜色。
data-title sometext 规定页面标题
data-url url 更新 URL 的值,而不是用于请求页面的 URL


música pop

Data-role = contenedor "emergente" con.

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

Con los datos rel =-ancla "emergente":

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 页面切换章节。


botón de opción

Con pares de etiqueta y input type = "radio" es. Ellos están prestando automáticamente estilo del botón de proceso, no se requiere de datos en papel.

Data-属性 描述
data-mini true | false 规定按钮是小尺寸还是常规尺寸
data-role none 防止 jQuery Mobile 渲染单选按钮的样式为增强状态的按钮,使元素以 HTML 原生的状态显示
data-theme 字母 (a-z) 规定单选按钮的主题颜色

lámpara Para combinar varios botones de radio, use = "grupo control" y de tipo de datos = atributo con data-role "horizontal | vertical" contenedor para especificar si las combinaciones horizontales o verticales de botones de radio.


seleccionar

Todo elemento <select>. Estos serán prestados de forma automática estilo de botón, no se requiere la fecha en roles.

Data-属性 描述
data-icon 图标参考手册 规定 select 元素的图标。默认是 "arrow-d"
data-iconpos left | right | top | bottom | notext 规定图标的位置
data-inline true | false 规定 select 元素是否内联
data-mini true | false 规定 select 元素是小尺寸还是常规尺寸
data-native-menu true | false 当设置为 false 时,它使用 jQuery 自带的自定义的选择菜单(如果您想要让选择菜单在所有的移动设备上都显示相同,则推荐这么使用)
data-overlay-theme 字母 (a-z) 规定 jQuery 自带的自定义的选择菜单的主题颜色(与 data-native-menu="false" 一起使用)
data-placeholder true | false 可在一个非原生的选择菜单的 <option> 元素上设置
data-role none 防止 jQuery Mobile 把 select 元素渲染成按钮样式
data-theme 字母 (a-z) 规定 select 元素的主题颜色

lámpara Para seleccionar una combinación de múltiples elementos, use = "grupo control" y de tipo de datos = atributo con data-role "horizontal | vertical" contenedor para especificar si las combinaciones horizontales o verticales de los elementos seleccionados.


deslizador

Con type = campo de entrada "gama". Estos serán prestados de forma automática estilo de botón, no se requiere la fecha en roles.

Data-属性 描述
data-highlight true | false 规定滑动轨道是否高亮突出显示
data-mini true | false 规定滑动块是小尺寸还是常规尺寸
data-role none 防止 jQuery Mobile 渲染滑动块控件为按钮样式
data-theme 字母 (a-z) 规定滑动块控件(输入框、手柄和轨道)的主题颜色
data-track-theme 字母 (a-z) 规定滑动块轨道的主题颜色


cuadro de entrada de texto y campo de entrada de texto

Con type = "text | búsqueda |. Etc" el elemento de entrada o área de texto. Estos serán prestados de forma automática estilo de botón, no se requiere la fecha en roles.

Data-属性 描述
data-mini true | false 规定输入框是小尺寸还是常规尺寸
data-role none 防止 jQuery Mobile 把输入框/输入域渲染成按钮样式
data-theme 字母 (a-z) 规定输入字段的主题颜色