VeryOK建站教程

jQuery Mobile 表單選擇

jQuery Mobile 選擇菜單

iPhone 上的選擇菜單:

Android 設備上的選擇菜單:

<select> 元素創建帶有若干選項的下拉菜單。

<select> 元素中的 <option> 元素定義列表中的可用選項:

實例

<form method="post" action="demoform.asp">
  <fieldset data-role="fieldcontain">
    <label for="day">選擇日期</label>
    <select name="day" id="day">
      <option value="mon">星期一</option>
      <option value="tue">星期二</option>
      <option value="wed">星期三</option>
    </select>
  </fieldset>
</form>

親自試一試

提示:如果列表中包含了一長列相關的選項,請在 <select> 中使用 <optgroup> 元素:

實例

<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>

親自試一試

自定義選擇菜單

本頁上方的圖片,展示了移動平臺顯示選擇菜單的獨特方式。

如果您希望在所有移動設備上顯示一致外觀的選擇菜單,請使用 jQuery 的自定義選擇菜單,data-native-menu="false" 屬性:

實例

<select name="day" id="day" data-native-menu="false">

親自試一試

Multiple Selections

如需在選擇菜單中選取多個選項,請在 <select> 元素中使用 multiple 屬性:

實例

<select name="day" id="day" multiple data-native-menu="false">

親自試一試

更多實例

使用 data-role="controlgroup"
如何組合一個或多個選擇菜單。
使用 data-type="horizontal"
如何水平地組合選擇菜單。
預選選項
如何預選擇一個選項。
可折疊表單
如何創建可折疊表單。
江西时时彩交易时间