form表单提交涉及到slider（jRange）
最近做商城的时候，需要做选择价格区间的这么一个功能，为了让选择更加直观，更加灵活；在网上搜索到了一款不错的插件，一款jQuery插件jRange：
Github地址：https://github.com/nitinhayaran/jRange
该插件使用起来也比较简单（而且官网也有详细说明）：
首先引入两个文件：
<link rel="stylesheet" type="text/css" href="css/jquery.range.css"> <script type="text/javascript" src="js/jquery.range.js"></script>
（当然还有jquery-1.11.3.min.js，毕竟该插件是以jquery开发的）
html部分代码：
<input type="hidden" id="range" class="slider-input" value="3000" />
js部分：
$('.slider-input').jRange({ from: 0, to: 10000, step: 1, format: '%s'+'元', width: 240, showLabels: true, isRange : true });
以上就是引用过程，就是这么简单！
配置讲解：
选项 | 必选 | 类型 | 说明 |
|---|---|---|---|
from | 必选 | Integer | 最小值 |
to | 必选 | Integer | 最大值 |
step | 可选 | Integer | 增量 (默认为1) |
scale | 可选 | Array | 刻度条。例如[0,50,100] |
showLabels | 可选 | Boolean | 显示标签(默认true) |
showScale | 可选 | Boolean | 显示刻度(默认true) |
format | 可选 | String/Function | 用来设置标签的格式 例如"%s 天" |
width | 可选 | Integer | 宽度(默认300) |
theme | 可选 | String | 主题(默认是"theme-green"绿色),还有"theme-blue"蓝色。你可以在jquery.range.less中设置 |
isRange | 可选 | Boolean | 是否为范围(默认false,选择一个点),如果是true，选择的是范围,格式为'1,2' |
snap | 可选 | Boolean | 是否只允许按增值选择(默认false) |
disable | 可选 | Boolean | 是否只读(默认false),若为true,只读模式，无法选择。可以用js动态设置('.slider').jRange('enable'); $('.slider').jRange('toggleDisable'); |
onstatechange | 可选 | Function | 数字变化的时候的回调函数 |
ondragend | 可选 | Function | 拖动结束时的回调函数 |
onbarclicked | 可选 | Function | 刻度条被按住时的回调函数 |
腾讯云开发者
