Entradas de texto jQuery Mobile
Os campos de entrada são codificados com elementos HTML padrão, e jQuery Mobile estilo deles para olhar atraente e fácil de usar para dispositivos móveis. Você também pode usar os novos HTML5 <input> tipos:
Exemplo
<form method="post" action="demoform.asp">
<div class="ui-field-contain">
<label for="fullname">Full name:</label>
<input
type="text" name="fullname" id="fullname">
<label
for="bday">Date of Birth:</label>
<input type="date" name="bday"
id="bday">
<label for="email">E-mail:</label>
<input type="email" name="email" id="email" placeholder="Your email..">
</div>
</form>
Tente você mesmo " área de texto
Use <textarea> para entradas de texto multi-linha.
Nota: A área de texto vai crescer automaticamente para caber novas linhas enquanto você digita algum texto.
Exemplo
<label for="info">Additional Information:</label>
<textarea
name="addinfo" id="info"></textarea>
Tente você mesmo " Procurar entrada
A entrada type="search" é novo em HTML5, e define um campo de texto para inserir uma pesquisa:
Exemplo
<label for="search">Search:</label>
<input
type="search" name="search" id="search">
Tente você mesmo " Botões do rádio
Os botões de rádio são usadas quando um usuário pode selecionar apenas um de um número limitado de opções.
Para criar um conjunto de botões de rádio, adicione uma entrada com type="radio" e uma etiqueta correspondente. Enrole os botões de rádio em um <fieldset> elemento. Você também pode adicionar um <legend> elemento para definir uma legenda para a <fieldset> .
Dica: Use data-role="controlgroup" , para agrupar os botões juntos:
Exemplo
<form method="post" action="demoform.asp">
<fieldset
data-role="controlgroup">
<legend>Choose your
gender:</legend>
<label
for="male">Male</label>
<input
type="radio" name="gender" id="male" value="male">
<label for="female">Female</label>
<input
type="radio" name="gender" id="female" value="female">
</fieldset>
</form>
Tente você mesmo " checkboxes
Checkboxes são usados quando um usuário pode selecionar uma ou mais opções de um número limitado de opções:
Exemplo
<form method="post" action="demoform.asp">
<fieldset
data-role="controlgroup">
<legend>Choose as many
favorite colors as you'd like:</legend>
<label for="red">Red</label>
<input
type="checkbox" name="favcolor" id="red" value="red">
<label for="green">Green</label>
<input
type="checkbox" name="favcolor" id="green" value="green">
<label for="blue">Blue</label>
<input
type="checkbox" name="favcolor" id="blue" value="blue">
</fieldset>
</form>
Tente você mesmo " mais Exemplos
Para botões de rádio do grupo ou caixas horizontalmente, use o data-type="horizontal" :
Você também pode envolver um recipiente campo em torno do <fieldset> :
Exemplo
<div class="ui-field-contain">
<fieldset data-role="controlgroup">
<legend>Choose your gender:</legend>
</fieldset>
</div>
Tente você mesmo " Se você quer um de seus botões para ser "pre-selected" , use o HTML <input> atributo verificado:
Você também pode colocar o formulário dentro de um pop-up:
Exemplo
<a href="#myPopup" data-rel="popup" class="ui-btn ui-btn-inline">Show Popup Form</a>
<div
data-role="popup" id="myPopup" class="ui-content">
<form method="post" action="demoform.asp">
<div>
<h3>Login information</h3>
<label for="usrnm" class="ui-hidden-accessible">Username:</label>
<input type="text" name="user" id="usrnm" placeholder="Username">
<label for="pswd" class="ui-hidden-accessible">Password:</label>
<input type="password" name="passw" id="pswd" placeholder="Password">
</div>
</form>
</div>
Tente você mesmo "