jQuery Mobile 表單滑動條
jQuery Mobile 滑動條控件
滑動條允許您從一個范圍的數字中選擇一個值:
如需創建滑動條,請使用 <input type="range">:
實例
<form method="post" action="demoform.html">
<div data-role="fieldcontain">
<label for="points">Points:</label>
<input type="range" name="points" id="points" value="50" min="0" max="100">
</div>
</form>
嘗試一下 ? 使用以下屬性來規定限制:
- max - 規定允許的最大值
- min - 規定允許的最小值
- step - 規定合法的數字間隔
- value - 規定默認值
提示:如果您想要高亮突出顯示滑動條的值,請添加 data-highlight="true":
實例
<input type="range" data-hightlight="true">
嘗試一下 ?
撥動開關
波動開關通常用于 on/off 或 true/false 按鈕:
如需創建一個開關,請把 <select> 元素與 data-role="slider" 一起使用,并添加兩個 <option> 元素:
實例
<form method="post" action="demoform.html">
<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" 屬性來設置選項中的一個為預選中狀態(高亮突出顯示狀態):
實例
<option value="off" selected>Off</option>
嘗試一下 ?