jQuery Mobile 滑塊控件

滑塊允許您從一定范圍內(nèi)的數(shù)字中選取值：

如需創(chuàng)建滑塊，請使用 <input type="range">：

實例

<form method="post" action="demoform.asp">
  <div data-role="fieldcontain">
    <label for="points">Points:</label>
    <input type="range" name="points" id="points" value="50" min="0" max="100">
  </div>
</form>

親自試一試

使用下列屬性來規(guī)定限定：

• max - 規(guī)定允許的最大值
• min - 規(guī)定允許的最小值
• step - 規(guī)定合法的數(shù)字間隔
• value - 規(guī)定默認值

提示：如果您希望突出顯示截止滑塊值的這段軌道，請?zhí)砑?data-highlight="true"：

實例

<input type="range" data-hightlight="true">

親自試一試

切換開關(guān)

切換開關(guān)常用于開/關(guān)或?qū)?錯按鈕：

如需創(chuàng)建切換，請使用 data-role="slider" 的 <select> 元素，并添加兩個 <option> 元素：

實例

<form method="post" action="demoform.asp">
  <div data-role="fieldcontain">
    <label for="switch">Toggle Switch:</label>
    <select name="switch" id="switch" data-role="slider">
      <option value="on">On</option>
      <option value="off">Off</option>
    </select>
  </div>
</form>

親自試一試

提示：請使用 "selected" 屬性來把選項之一設(shè)置為預選（突出顯示）：

實例

<option value="off" selected>Off</option>

親自試一試