首页
会员中心
到顶部
到尾部
jQuery Mobile 教程

jQuery Mobile 表单 - 滑块

时间:2020/11/2 13:13:09  作者:  来源:  查看:0  评论:0
内容摘要:jQuery Mobile 表单 - 滑块jQuery Mobile 表单选择jQuery Mobile 主题jQuery Mobile 滑块控件滑块允许您从一定范围内的数字中选取值:如需创建滑块,请使用 <input type="range">:...

jQuery Mobile 表单 - 滑块

jQuery Mobile 滑块控件

滑块允许您从一定范围内的数字中选取值:

如需创建滑块,请使用 <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>

亲自试一试

使用下列属性来规定限定:

  • max - 规定允许的最大值
  • min - 规定允许的最小值
  • step - 规定合法的数字间隔
  • value - 规定默认值

提示:如果您希望突出显示截止滑块值的这段轨道,请添加 data-highlight="true":

实例

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

亲自试一试

切换开关

切换开关常用于开/关或对/错按钮:

如需创建切换,请使用 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" 属性来把选项之一设置为预选(突出显示):

实例

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

亲自试一试



相关评论
广告联系QQ:45157718 点击这里给我发消息 电话:13516821613 杭州余杭东港路118号雷恩国际科技创新园  网站技术支持:黄菊华互联网工作室 浙ICP备06056032号