最新的Web开发教程
 

jQuery Mobile表单中选择菜单


jQuery Mobile的选择菜单

在iPhone上选择菜单:
一,选择菜单中Android/SGS4设备:

<select>元素创建了几个选项的下拉列表。

<option>元素中的<select>元素定义列表中的可用选项:

<form method="post" action="demoform.asp">
  <fieldset class="ui-field-contain">
    <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>
试一试»

提示:如果你有一个选项一长串是相关的,使用<optgroup>元素中<select>

<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" >
试一试»

多重选择

要在选择菜单中选择多个选项,请使用多个属性<select>元素:

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

更多示例

使用data-role="controlgroup"
如何对一组或多个选择的菜单。

使用data-type="horizontal"
如何组选择菜单水平。

使用data-type="mini"
如何来缩小选择菜单。

预选选项
如何预先选择一个选项。

弹出选择
如何创建一个弹出选择菜单。

可折叠的形式
如何创建可折叠的形式。

更改默认选择图标
如何改变选择菜单的图标(默认为"arrow-d"

更改图标位置
如何改变选择菜单的图标位置(默认值是right )。