)文本框
<div
data-role="fieldcontain">
<label
for="name">文本框:</label>
<input type="text" name="name" id="name"
value="" />
</div>
2)内容框
<div
data-role="fieldcontain">
<label
for="textarea">Textarea:</label>
<textarea cols="40" rows="8" name="textarea"
id="textarea"></textarea>
</div>
3) 搜索框
<div
data-role="fieldcontain">
<label
for="search">搜索框:</label>
<input type="search" name="password" id="search"
value="" />
</div>
4) 两项下拉框
<div
data-role="fieldcontain">
<label
for="slider2">滑动开关:</label>
<select name="slider2"
id="slider2" data-role="slider">
<option
value="off">关</option>
<option
value="on">开</option>
</select>
</div>
5) 范围表单
<div
data-role="fieldcontain">
<label
for="slider">滑动:</label>
<input type="range" name="slider"
id="slider" value="0" min="0" max="100"
/>
</div>
6) 多选框
<div
data-role="fieldcontain">
<fieldset
data-role="controlgroup">
<legend>选择你喜欢的运动:</legend>
<input type="checkbox" name="checkbox-1a"
id="checkbox-1a" class="custom" />
<label
for="checkbox-1a">游泳</label>
<input type="checkbox"
name="checkbox-2a" id="checkbox-2a" class="custom"
/>
<label
for="checkbox-2a">跑步</label>
<input type="checkbox"
name="checkbox-3a" id="checkbox-3a" class="custom"
/>
<label
for="checkbox-3a">跳高</label>
<input type="checkbox"
name="checkbox-4a" id="checkbox-4a" class="custom"
/>
<label
for="checkbox-4a">自行车</label>
</fieldset>
</div>
7)水平方向多选框
<div
data-role="fieldcontain">
<fieldset data-role="controlgroup"
data-type="horizontal">
<legend>水平多选框:</legend>
<input
type="checkbox" name="checkbox-6" id="checkbox-6" class="custom"
/>
<label
for="checkbox-6">b</label>
<input
type="checkbox" name="checkbox-7" id="checkbox-7" class="custom"
/>
<label
for="checkbox-7"><em>i</em></label>
<input type="checkbox" name="checkbox-8"
id="checkbox-8" class="custom" />
<label
for="checkbox-8">u</label>
</fieldset>
</div>
8)单选框
<div
data-role="fieldcontain">
<fieldset
data-role="controlgroup">
<legend>单选框:</legend>
<input type="radio" name="radio-choice-1"
id="radio-choice-1" value="choice-1" checked="checked"
/>
<label
for="radio-choice-1">Cat</label>
<input type="radio"
name="radio-choice-1" id="radio-choice-2"
value="choice-2" />
<label
for="radio-choice-2">Dog</label>
<input type="radio"
name="radio-choice-1" id="radio-choice-3"
value="choice-3" />
<label
for="radio-choice-3">Hamster</label>
<input type="radio"
name="radio-choice-1" id="radio-choice-4"
value="choice-4" />
<label
for="radio-choice-4">Lizard</label>
</fieldset>
</div>
9)水平方向单选框
<div
data-role="fieldcontain">
<fieldset data-role="controlgroup"
data-type="horizontal">
<legend>视图:</legend>
<input
type="radio" name="radio-choice-b" id="radio-choice-c" value="on"
checked="checked" />
<label
for="radio-choice-c">List</label>
<input
type="radio" name="radio-choice-b" id="radio-choice-d" value="off"
/>
<label
for="radio-choice-d">Grid</label>
<input
type="radio" name="radio-choice-b" id="radio-choice-e"
value="other" />
<label
for="radio-choice-e">Gallery</label>
</fieldset>
</div>
10)下拉框
<div
data-role="fieldcontain">
<label for="select-choice-1"
class="select">下拉框:</label>
<select name="select-choice-1"
id="select-choice-1">
<option
value="standard">足球</option>
<option
value="rush">中国足球</option>
<option
value="express">亚洲足球</option>
<option
value="overnight">世界足球</option>
</select>
</div>
11)弹出式下拉框
<div
data-role="fieldcontain">
<label for="select-choice-a"
class="select">弹出式下拉框:</label>
<select name="select-choice-a"
id="select-choice-a" data-native-menu="false">
<option
value="standard">足球</option>
<option
value="rush">中国足球</option>
<option
value="express">亚洲足球</option>
<option
value="overnight">世界足球</option>
</select>
</div>
12)按钮
<div
data-role="fieldcontain">
<button type="submit"
data-theme="d">取消</button>
</div>
<div data-role="fieldcontain">
<button type="submit"
data-theme="b">提交</button>
</div>