1. <form> 元素必须设置 method 和 action 属性
2. 每个表单元素必须设置唯一的 "id" 属性。
该 id 在站点的页面中必须是唯一的。
这是因为 jQuery Mobile 的单页面导航模型允许许多不同的“页面”同时呈现。
3. 每个表单元素必须有一个标记（label）。
请设置 label 的 for 属性来匹配元素的 id。
二、各种属性的使用
【文本框】
data-role="fieldcontain" 大于480px 自动与label 同到一行
<div data-role="fieldcontain"> <label for="lname">姓：</label> <input type="text"> <label for="fname">名：</label> <input type="text"> </div>
如果不希望使用 jquery-mobile的样式
data-role="none"
【搜索框】
加上data-role="fieldcontain" 一行 不加每个标签一行
<div data-role="fieldcontain"> <label for="search">Search:</label> <input type="search"> <div data-role="fieldcontain">
【单选框】
<fieldset data-role="controlgroup"> <legend>请选择您的性别：</legend> <label for="male">男性</label> <input type="radio" value="male"> <label for="female">女性</label> <input type="radio" value="female"> </fieldset>
【复选框】
<fieldset data-role="controlgroup"> <legend>请选择您喜爱的颜色：</legend> <label for="red">红色</label> <input type="checkbox" value="red"> <label for="green">绿色</label> <input type="checkbox" value="green"> <label for="blue">蓝色</label> <input type="checkbox" value="blue"> </fieldset>
[注意]：单复选水平分组
可在fieldset 标签中添加属性
data-type="horizontal"
预选某个按钮 可以使用：
input 的 checked
【选择菜单】
普通选择菜单，有点丑
<fieldset data-role="fieldcontain"> <label for="day">选择日期</label> <select> <option value="mon">星期一</option> <option value="tue">星期二</option> <option value="wed">星期三</option> </select> </fieldset>
自定义选择菜单
使用属性：
data-native-menu="false"
<fieldset data-role="fieldcontain"> <label for="day">选择天</label> <select data-native-menu="false"> <option value="mon">星期一</option> <option value="tue">星期二</option> <option value="wed">星期三</option> <option value="thu">星期四</option> <option value="fri">星期五</option> <option value="sat">星期六</option> <option value="sun">星期日</option> </select> </fieldset>
【多选菜单】
需要使用自定义的
multiple="multiple" data-native-menu="false"
<fieldset> <label for="day">您可以选择多天：</label> <select multiple="multiple" data-native-menu="false"> <option>天</option> <option value="mon">星期一</option> <option value="tue">星期二</option> <option value="wed">星期三</option> <option value="thu">星期四</option> <option value="fri">星期五</option> <option value="sat">星期六</option> <option value="sun">星期日</option> </select> </fieldset>
【滑动条】
<div data-role="fieldcontain"> <label for="points">Points:</label> <input type="range" value="50" min="0" max="100"> </div>
max - 规定允许的最大值
min - 规定允许的最小值
step - 规定合法的数字间隔
value - 规定默认值
<div data-role="fieldcontain"> <label for="points">Points:</label> <input type="range" value="50" min="0" max="100" data-highlight="true"> </div>
【翻转切换开关】
data-role="slider"
默认选中可加 selected
<div data-role="fieldcontain"> <label for="switch">Toggle Switch:</label> <select data-role="slider"> <option value="on">On</option> <option value="off">Off</option> </select> </div>
颜色主题
【主题样式】
a 默认。黑色背景上的白色文本。
b 蓝色背景上的白色文本 / 灰色背景上的黑色文本
c 亮灰色背景上的黑色文本
d 白色背景上的黑色文本
e 橙色背景上的黑色文本
一般情况下 使用上面的颜色 可以直接使用属性
data-theme="e"
如果要改变对话框(遮罩)的背景色
data-overlay-theme="e" （放在page上）
改变可折叠的背景颜色
data-theme="b" data-content-theme="e" （放在collapsible）
主题划分按钮
data-split-theme="e" （放在 listview）
【添加新样式】