jQuery Mobile - Attributi dei dati
Pulsante
Specifica un pulsante cliccabile che include contenuti come testo o immagini utilizzando la classe ui-btn . È deprecato nella versione 1.4. Utilizza l' attributo ui-btn invece di utilizzare l'attributo data-role = "button" .
La tabella seguente elenca gli elementi del pulsante utilizzati con l'attributo data.
Sr.No. | Attributo dei dati e descrizione | Valore |
---|---|---|
1 | data-corners Definisce se il pulsante deve contenere angoli arrotondati o meno. |
vero | falso |
2 | data-icon Definisce l'icona del pulsante. |
L'impostazione predefinita è nessuna icona |
3 | data-iconpos Definisce la posizione dell'icona. |
sinistra | a destra | top | parte inferiore |
4 | data-iconshadow Definisce se l'icona del pulsante deve contenere un'ombra o meno. |
vero | falso |
5 | data-inline Definisce se il pulsante deve essere in linea o meno. |
vero | falso |
6 | data-mini Definisce se il pulsante deve essere visualizzato in dimensioni minori o normali. |
vero | falso |
7 | data-shadow Definisce se il pulsante deve contenere un'ombra o meno. |
vero | falso |
8 | data-theme Visualizza il colore del tema per il pulsante. |
lettera (az) |
Casella di controllo
La tabella seguente elenca gli elementi della casella di controllo utilizzati con type = "checkbox".
Sr.No. | Attributo dei dati e descrizione | Valore |
---|---|---|
1 | data-mini Definisce se la casella di controllo deve essere visualizzata in dimensioni inferiori o normali. |
vero | falso |
2 | data-role Arresta lo stile delle caselle di controllo come pulsanti. |
nessuna |
3 | data-theme Visualizza il colore del tema per la casella di controllo. |
lettera (az) |
Collassabile
La tabella seguente elenca gli elementi comprimibili utilizzati con data-role = "collapsible" attributo.
Sr.No. | Attributo dei dati e descrizione | Valore |
---|---|---|
1 | data-collapsed Indica se il contenuto deve essere chiuso o espanso. |
vero | falso |
2 | data-collapsed-cue-text Visualizza il feedback per gli utenti con software di lettura dello schermo. |
L'impostazione predefinita è la compressione del contenuto |
3 | data-collapsed-icon Definisce l'icona del pulsante pieghevole. |
L'icona predefinita è "più" |
4 | data-content-theme Visualizza il colore del tema per il contenuto pieghevole. |
lettera (az) |
5 | data-expanded-cue-text Visualizza il feedback per gli utenti con software di lettura dello schermo. |
L'impostazione predefinita è l'espansione del contenuto |
6 | data-expanded-icon Visualizza il pulsante comprimibile quando si espande il contenuto. |
L'icona predefinita è "meno" |
7 | data-iconpos Definisce la posizione dell'icona. |
sinistra | a destra | top | parte inferiore |
8 | data-inset Definisce se il pulsante pieghevole deve essere visualizzato con angoli e margini arrotondati o meno. |
vero | falso |
9 | data-mini Definisce se i pulsanti pieghevoli devono essere visualizzati in dimensioni più piccole o in dimensioni normali. |
vero | falso |
10 | data-theme Visualizza il colore del tema per il pulsante pieghevole. |
lettera (az) |
Set pieghevole
La tabella seguente elenca gli elementi dell'insieme comprimibili utilizzati con data-role = "collapsibleset" attributo.
Sr.No. | Attributo dei dati e descrizione | Valore |
---|---|---|
1 | data-collapsed-icon Definisce l'icona del pulsante pieghevole. |
L'icona predefinita è "più" |
2 | data-content-theme Visualizza il colore del tema per il contenuto pieghevole. |
lettera (az) |
3 | data-expanded-icon Visualizza il pulsante comprimibile quando si espande il contenuto. |
L'icona predefinita è "meno" |
4 | data-iconpos Definisce la posizione dell'icona. |
sinistra | a destra | top | parte inferiore |
5 | data-inset Definisce se il pulsante pieghevole deve essere visualizzato con angoli e margini arrotondati o meno. |
vero | falso |
6 | data-mini Definisce se i pulsanti pieghevoli devono essere visualizzati in dimensioni più piccole o in dimensioni normali. |
vero | falso |
7 | data-theme Visualizza il colore del tema per il pulsante pieghevole. |
lettera (az) |
Gruppo di controllo
La tabella seguente elenca gli elementi del gruppo di controllo utilizzati con data-role = "controlgroup" attributo -
Sr.No. | Attributo dei dati e descrizione | Valore |
---|---|---|
1 | data-exclude-invisible Definisce se escludere i bambini invisibili nell'assegnazione degli angoli arrotondati. |
vero | falso |
2 | data-mini Definisce se il gruppo deve essere visualizzato in dimensioni più piccole o in dimensioni normali. |
vero | falso |
3 | data-theme Visualizza il colore del tema per il gruppo di controllo. |
lettera (az) |
4 | data-type Indica se il gruppo deve essere visualizzato in formato orizzontale o verticale. |
orizzontale | verticale |
Dialogo
La tabella seguente elenca gli elementi di dialogo utilizzati con data-dialog="true" attributo.
Sr.No. | Attributo dei dati e descrizione | Valore |
---|---|---|
1 | data-close-btn Definisce la posizione del pulsante di chiusura. |
sinistra | a destra | nessuna |
2 | data-close-btn-text Definisce il testo per il pulsante di chiusura. |
testo |
3 | data-corners Definisce se la finestra di dialogo deve essere visualizzata con angoli arrotondati o meno. |
vero | falso |
4 | data-dom-cache Indica se la cache DOM deve svuotare o meno le singole pagine. |
vero | falso |
5 | data-overlay-theme Definisce il colore di sovrapposizione della pagina di dialogo. |
lettera (az) |
6 | data-theme Definisce il colore del tema della pagina di dialogo. |
lettera (az) |
7 | data-title Definisce il titolo della pagina di dialogo. |
testo |
Aumento
La tabella seguente elenca gli elementi di miglioramento utilizzati con data-enhance="false" or data-ajax = "false" attributo.
Sr.No. | Attributo dei dati e descrizione | Valore |
---|---|---|
1 | data-enhance Puoi applicare uno stile alla pagina impostando questo attributo su "true". Non è possibile applicare uno stile alla pagina se è impostato su "false". |
vero | falso |
2 | data-ajax Indica se le pagine devono essere caricate da Ajax o meno. |
vero | falso |
Barra degli strumenti fissa
La tabella seguente elenca gli elementi della barra degli strumenti utilizzati con data-position = "fixed" attributo.
Sr.No. | Attributo dei dati e descrizione | Valore |
---|---|---|
1 | data-disable-page-zoom Definisce se l'utente è in grado di ridimensionare / ingrandire la pagina o meno. |
vero | falso |
2 | data-fullscreen Definisce che le barre degli strumenti devono essere posizionate in alto e / o in basso. |
vero | falso |
3 | data-tap-toggle Indica se l'utente può attivare o meno la visibilità della barra degli strumenti sui tocchi. |
vero | falso |
4 | data-transition Mostra un effetto di transizione quando tocchi o fai clic sull'elemento. |
diapositiva | dissolvenza | nessuna |
5 | data-update-page-padding Aggiorna il riempimento della pagina utilizzando eventi di ridimensionamento, transizione e aggiornamento del layout. |
vero | falso |
6 | data-visible-on-page-show Definisce la visibilità della barra degli strumenti quando viene mostrata la pagina principale. |
vero | falso |
Flip interruttore a levetta
La tabella seguente elenca gli elementi di commutazione di inversione utilizzati con data-role = "flipswitch" attributo -
Sr.No. | Attributo dei dati e descrizione | Valore |
---|---|---|
1 | data-mini Definisce se lo switch deve essere visualizzato in dimensioni minori o normali. |
vero | falso |
2 | data-on-text Definisce il testo "on" sull'interruttore a scorrimento. |
L'impostazione predefinita è "on" |
3 | data-off-text Definisce il testo "off" sull'interruttore flip. |
L'impostazione predefinita è "off" |
Piè di pagina
La tabella seguente elenca gli elementi del piè di pagina utilizzati con l' attributo data-role = "footer" -
Sr.No. | Attributo dei dati e descrizione | Valore |
---|---|---|
1 | data-id Definisce l'ID univoco. |
testo |
2 | data-position Definisce se il piè di pagina deve essere posizionato in fondo o in linea con il contenuto della pagina. |
in linea | fisso |
3 | data-fullscreen Definisce se il piè di pagina deve essere posizionato in fondo e sopra il contenuto della pagina o meno. |
vero | falso |
4 | data-theme Definisce il colore del tema del piè di pagina. |
lettera (az) |
Intestazione
La tabella seguente elenca gli elementi di intestazione utilizzati con data-role = "header" attributo.
Sr.No. | Attributo dei dati e descrizione | Valore |
---|---|---|
1 | data-id Definisce l'ID univoco. |
testo |
2 | data-position Definisce se l'intestazione deve essere posizionata in fondo o in linea con il contenuto della pagina. |
in linea | fisso |
3 | data-fullscreen Definisce se l'intestazione deve essere posizionata in fondo e sopra il contenuto della pagina o meno. |
vero | falso |
4 | data-theme Definisce il colore del tema dell'intestazione. |
lettera (az) |
Ingressi
La tabella seguente elenca gli elementi di input utilizzati con type = "text|search|etc" attributo.
Sr.No. | Attributo dei dati e descrizione | Valore |
---|---|---|
1 | data-clear-btn Definisce se l'elemento di input deve contenere un pulsante di cancellazione o meno. |
vero | falso |
2 | data-clear-btn-text Definisce il testo per il pulsante cancella. |
testo |
3 | data-mini Definisce se l'input deve essere visualizzato in dimensioni più piccole o in dimensioni normali. |
vero | falso |
4 | data-role Smette di definire l'input o le aree di testo come pulsanti. |
nessuna |
5 | data-theme Definisce il colore del tema dell'elemento di input. |
lettera (az) |
Link
La tabella seguente elenca gli elementi di collegamento utilizzati con jQuery Mobile.
Sr.No. | Attributo dei dati e descrizione | Valore |
---|---|---|
1 | data-ajax Indica se le pagine devono essere caricate tramite Ajax o meno. |
vero | falso |
2 | data-direction Viene utilizzato per la transizione inversa. |
inversione |
3 | data-dom-cache Indica se la cache del DOM jQuery deve essere pulita o meno per le pagine. |
vero | falso |
4 | data-prefetch Viene utilizzato per precaricare le pagine nel DOM. |
vero | falso |
5 | data-rel Specifica il comportamento del collegamento. |
indietro | dialogo | esterno | apparire |
6 | data-transition Definisce il passaggio da una pagina all'altra. |
dissolvenza | capovolgere | flusso | pop | diapositiva | slidedown | slidefade | slideup | girare | nessuna |
7 | data-position-to Definisce la posizione delle caselle popup. |
origine | selettore jQuery | finestra |
Elenco
La tabella seguente mostra gli elementi dell'elenco utilizzati con data-role = "listview" attributo.
Sr.No. | Attributo dei dati e descrizione | Valore |
---|---|---|
1 | data-autodividers Divide automaticamente l'elenco. |
vero | falso |
2 | data-count-theme Definisce il colore del tema dell'elemento count. |
lettera (az) |
3 | data-divider-theme Definisce il colore del tema per il divisore di elenco. |
lettera (az) |
4 | data-filter Viene utilizzato per filtrare i valori dell'elenco nella casella di ricerca. |
vero | falso |
5 | data-filter-placeholder Definisce del testo all'interno della casella di ricerca. |
testo |
6 | data-filter-theme Definisce il colore del tema per il filtro di ricerca. |
lettera (az) |
7 | data-icon Fornisce l'icona per l'elenco. |
L'impostazione predefinita è nessuna icona |
8 | data-inset Definisce se l'elenco deve essere visualizzato con angoli e margini arrotondati o meno. |
vero | falso |
9 | data-split-icon Definisce l'icona per il pulsante di divisione. |
L'icona predefinita è "freccia-r" |
10 | data-split-theme Definisce il colore del tema per il pulsante di divisione. |
lettera (az) |
11 | data-theme Definisce il colore del tema per l'elenco. |
lettera (az) |
Voce di elenco
La tabella seguente mostra gli elementi della voce di elenco utilizzati con data-role = "listview" attributo.
Sr.No. | Attributo dei dati e descrizione | Valore |
---|---|---|
1 | data-filtertext Viene utilizzato per filtrare i valori dell'elenco utilizzando il testo nella casella di ricerca. |
testo |
2 | data-icon Fornisce l'icona per l'elemento dell'elenco. |
L'impostazione predefinita è nessuna icona |
3 | data-role Definisce il divisore per gli elementi dell'elenco. |
list-divisore |
4 | data-theme Definisce il colore del tema per l'elemento dell'elenco. |
lettera (az) |
Navbar
La tabella seguente elenca gli elementi della barra di navigazione utilizzati con data-role = "navbar" attributo.
Sr.No. | Attributo dei dati e descrizione | Valore |
---|---|---|
1 | data-icon Fornisce l'icona per l'elemento dell'elenco. |
L'impostazione predefinita è nessuna icona |
2 | data-iconpos Definisce la posizione dell'icona. |
sinistra | a destra | top | fondo | notext |
Pagina
La tabella seguente elenca gli elementi della pagina utilizzati con data-role = "page" attributo.
Sr.No. | Attributo dei dati e descrizione | Valore |
---|---|---|
1 | data-dom-cache Indica se la cache DOM deve svuotare o meno le singole pagine. |
vero | falso |
2 | data-overlay-theme Definisce il colore di sovrapposizione delle pagine di dialogo. |
lettera (az) |
3 | data-theme Definisce il colore del tema per la pagina. |
lettera (az) |
4 | data-title Fornisce il titolo della pagina. |
L'impostazione predefinita è nessuna icona |
5 | data-url Viene utilizzato per aggiornare l'URL. |
url |
Apparire
La tabella seguente elenca gli elementi popup utilizzati con data-role = "popup" attributo.
Sr.No. | Attributo dei dati e descrizione | Valore |
---|---|---|
1 | data-corners Definisce se il popup deve essere visualizzato con angoli e margini arrotondati o meno. |
vero | falso |
2 | data-dismissible Definisce se il popup deve essere chiuso facendo clic all'esterno o meno. |
vero | falso |
3 | data-history Definisce se il popup deve visualizzare la cronologia dell'elemento quando viene aperto. |
vero | falso |
4 | data-overlay-theme Definisce il colore di sovrapposizione della finestra popup. |
lettera (az) |
5 | data-shadow Visualizza l'ombra per la finestra popup. |
vero | falso |
6 | data-theme Definisce il colore del tema per la finestra popup. |
lettera (az) |
7 | data-tolerance Definisce i bordi della finestra. |
30, 15, 30, 15 |
Pulsante radio
La tabella seguente elenca gli elementi del pulsante di opzione utilizzati con type = "radio" attributo.
Sr.No. | Attributo dei dati e descrizione | Valore |
---|---|---|
1 | data-mini Definisce se il pulsante deve essere visualizzato in dimensioni minori o normali. |
vero | falso |
2 | data-role Arresta lo stile dei pulsanti di opzione come pulsanti avanzati. |
nessuna |
3 | data-theme Definisce il colore del tema per il pulsante di opzione. |
lettera (az) |
Selezionare
La tabella seguente elenca gli elementi selezionati utilizzati con jQuery Mobile.
Sr.No. | Attributo dei dati e descrizione | Valore |
---|---|---|
1 | data-icon Fornisce l'icona per l'elemento selezionato. |
L'impostazione predefinita è "freccia-d" |
2 | data-iconpos Definisce la posizione dell'icona. |
sinistra | a destra | top | parte inferiore |
3 | data-inline Definisce se il pulsante deve essere in linea o meno. |
vero | falso |
4 | data-mini Definisce se select deve essere visualizzato in dimensioni più piccole o in dimensioni normali. |
vero | falso |
5 | data-native-menu Usa il menu personalizzato quando è stato impostato su false. |
vero | falso |
6 | data-overlay-theme Definisce il colore di sovrapposizione per il menu di selezione personalizzato. |
lettera (az) |
7 | data-placeholder Viene utilizzato per impostare un elemento di opzione di selezione non nativa. |
vero | falso |
8 | data-role Arresta lo stile degli elementi selezionati come pulsanti. |
nessuna |
9 | data-theme Visualizza il colore del tema per gli elementi selezionati. |
lettera (az) |
Slider
La tabella seguente elenca gli elementi di scorrimento utilizzati con type = "range" attributo.
Sr.No. | Attributo dei dati e descrizione | Valore |
---|---|---|
1 | data-highlight Evidenzia il cursore. |
vero | falso |
2 | data-mini Definisce se il dispositivo di scorrimento deve essere visualizzato in dimensioni inferiori o regolari. |
vero | falso |
3 | data-role Arresta lo stile dei controlli di scorrimento come pulsanti. |
nessuna |
4 | data-theme Visualizza il colore del tema per il controllo del dispositivo di scorrimento. |
lettera (az) |
5 | data-track-theme Visualizza il colore del tema per la traccia di scorrimento. |
lettera (az) |