免費(fèi)AI編程助手
jQuery Mobile 表單選擇
2018-02-03 14:36 更新
jQuery Mobile 表單選擇菜單
jQuery Mobile 選擇菜單
Iphone 上的選擇菜單：
Android/SGS4 設(shè)備上的選擇菜單：
<select> 元素創(chuàng)建帶有若干選項(xiàng)的下拉列表。
<select> 元素內(nèi)的 <option> 元素定義了列表中的可用選項(xiàng)：
實(shí)例
<form method="post" action="demoform.html">
<fieldset data-role="fieldcontain">
<label for="day">Select Day</label>
<select name="day" id="day">
<option value="mon">Monday</option>
<option value="tue">Tuesday</option>
<option value="wed">Wednesday</option>
</select>
</fieldset>
</form>
<fieldset data-role="fieldcontain">
<label for="day">Select Day</label>
<select name="day" id="day">
<option value="mon">Monday</option>
<option value="tue">Tuesday</option>
<option value="wed">Wednesday</option>
</select>
</fieldset>
</form>
嘗試一下 ?
提示：如果您有一個(gè)帶有相關(guān)選項(xiàng)的很長(zhǎng)的列表，請(qǐng)?jiān)?<select> 內(nèi)使用 <optgroup> 元素：
實(shí)例
<select name="day" id="day">
<optgroup label="Weekdays">
<option value="mon">Monday</option>
<option value="tue">Tuesday</option>
<option value="wed">Wednesday</option>
</optgroup>
<optgroup label="Weekends">
<option value="sat">Saturday</option>
<option value="sun">Sunday</option>
</optgroup>
</select>
<optgroup label="Weekdays">
<option value="mon">Monday</option>
<option value="tue">Tuesday</option>
<option value="wed">Wednesday</option>
</optgroup>
<optgroup label="Weekends">
<option value="sat">Saturday</option>
<option value="sun">Sunday</option>
</optgroup>
</select>
嘗試一下 ?
自定義選擇菜單
本頁(yè)頂部的圖像，演示了移動(dòng)平臺(tái)上如何使用它們的方式展示一個(gè)選擇菜單。
如果您想要讓選擇菜單在所有的移動(dòng)設(shè)備上都顯示相同，請(qǐng)使用 jQuery 自帶的自定義選擇菜單，data-native-menu="false" 屬性：
多個(gè)選擇
如需在選擇菜單中選擇多個(gè)選項(xiàng)，請(qǐng)?jiān)?<select> 元素中使用 multiple 屬性：
更多實(shí)例
使用 data-role="controlgroup"
如何組合一個(gè)或多個(gè)選擇菜單。
使用 data-type="horizontal"
如何水平組合選擇菜單。
預(yù)選中選項(xiàng)
如何預(yù)選中一個(gè)選項(xiàng)。
可折疊表單
如何創(chuàng)建可折疊表單。
通過(guò)jQuery Mobile可以讓表單的選擇具有更加的效果，通過(guò)以上的使用實(shí)例你應(yīng)該感受到了，在下一節(jié)的內(nèi)容中，我們加一起來(lái)了解一下jQuery Mobile的表單滑動(dòng)條該怎么使用！
以上內(nèi)容是否對(duì)您有幫助：
更多建議：