Latest web development tutorials

Pulsante jQuery Mobile

Le applicazioni mobili sono costruiti sulla semplice click di cose che si desidera visualizzare.





Creare un pulsante di jQuery Mobile

In jQuery Mobile, il tasto può essere creata in tre modi:

  • Usa <button> elemento
  • Usa elemento <input>
  • Utilizzare <a> elementi con data-role = "bottone" di

<Button>

<button>按钮</button>

Prova »

<Input>

<input type="button" value="按钮">

Prova »

<a>

<a href="#" data-role="button" >按钮</a>

Prova »

lampada In jQuery Mobile, il pulsante verrà automaticamente styling, li rendono più attraente e disponibilità su dispositivi mobili. Si consiglia di utilizzare gli elementi <a> con data-role = "pulsante" del collegamento, utilizzare il <input> o <button> elemento tra le pagine modulo di presentazione.


pulsanti di navigazione

Per attraverso il legame tra le pagine tasto, usare <a> elementi con data-role = "button" proprietà:

Esempi

< a href="#pagetwo" data-role="button" >访问第二个页面</a>

Prova »


pulsante in linea

Per default, il pulsante occupa l'intera larghezza dello schermo. Se si desidera un contenuto solo largo come un pulsante, oppure se si desidera visualizzare due o più pulsanti affiancati, aggiungere i dati-linea = "true":

Esempi

<a href="#pagetwo" data-role="button" data-inline="true" >访问第二个页面</a>

Prova »


Una combinazione di tasti

jQuery Mobile fornisce un modo semplice per combinare un pulsante.

Si prega di inserire data-role = "controllo alimentati" attributi e data-type = "orizzontale | verticale" utilizzati insieme per specificare se le combinazioni orizzontali o verticali di pulsanti:

Esempi

<div data-role="controlgroup" data-type="horizontal" >
<a href="#anylink" data-role="button">按钮 1</a>
<a href="#anylink" data-role="button">按钮 2</a>
<a href="#anylink" data-role="button">按钮 3</a>
</div>

Prova »

lampada Per impostazione predefinita, i pulsanti sono una combinazione di composizione verticale, nessun margine e lo spazio tra di loro. E solo del primo e dell'ultimo pulsanti sono arrotondati, in modo che quando sono combinati insieme per creare un bello sguardo.


pulsante Indietro

Per creare un pulsante Indietro, utilizzare i dati-rel = "indietro" la proprietà (che ignora il valore href ancoraggio):

Esempi

<a href="#" data-role="button" data-rel="back" >返回</a>

Prova »


Altri link un'istanza di pulsante

categoria descrizione Esempi
ui-btn-b Modifica colore del pulsante è nero, il tipo di carattere è bianco (sfondo grigio predefinito, carattere nero). provare
ui-angolo-tutto Pulsante per aggiungere gli angoli arrotondati provare
ui-mini Fare piccoli pulsanti provare
ui-ombra Pulsante per aggiungere un'ombra provare

nota Se avete bisogno di più stili, ogni classe di stile separati da uno spazio, come ad esempio: class = "ui ui-btn-btn-inline ui-btn-angolo-tutto ui-ombra"

Per impostazione predefinita, il pulsante <input> ha gli angoli arrotondati ed effetto ombra. <a> e <button> elementi non lo fanno.

classi CSS più completo, consultare il nostro Manuale di jQuery Mobile CSS classe di riferimento .

La sezione successiva mostra come aggiungere un'icona sul pulsante.