| elem |
绑定元素选择器或 DOM 对象
|
string/DOM |
- |
| type |
滑块类型，可选值有：
- `default` 水平滑块（默认）
- `vertical`垂直滑块
|
string |
`default`
|
| value |
滑块初始值。
- 默认可直接设置数值，如： `value: 50`
- 若滑块开启 `range: true` 区间选择，则值为数组，异表示开始和结尾的区间，如： `value: [30, 60]`
|
number
array |
- |
| range |
是否开启滑块的区间选择。若开启，则滑块将出现两个可拖拽的点。
|
boolean |
`false`
|
| min |
滑块的最小值
|
number |
`0`
|
| max |
滑块的最大值
|
number |
`100`
|
| step |
滑块单次拖动的步长
|
number |
`1`
|
| showstep |
是否显示间断点
|
boolean |
`false`
|
| tips |
鼠标移入当前圆点，是否显示当前值
|
boolean |
`true`
|
| input |
是否显示滑块的数字输入框。 注：若设置 `range: true` 则该属性强制无效。
|
boolean |
`false`
|
| height |
滑动条高度。 必须设置 `type: 'vertical'` 属性，即垂直滑块时有效。
|
number |
`200`
|
| theme |
滑块的主题色。
|
string |
- |
| disabled |
是否禁用滑块
|
boolean |
`false`
|
| setTips |
滑块拖拽时设置提示文本的回调函数。并返回当前的 `value` 参数。用法详见：[#设置提示文本](#demo-setTips)
|
|
[回调函数](#options.callback)
|
| change |
滑块数值发生改变的回调函数。并返回当前的 `value` 参数。
```
slider.render({
elem: '#id',
change: function(value){
console.log(value) // 滑块当前值
// do something
}
});
```
一般可在该回调中将 `value` 同步给表单隐藏域，或者进行一些其它操作。
|
| done 2.8+ |
滑块拖拽完毕的回调函数。并返回当前的 `value` 参数。滑块拖动过程中不会触发。
```
slider.render({
elem: '#id',
done: function(value){
console.log(value) // 滑块当前值
// do something
}
});
```
若需将 `value` 异步发送给后端，一般采用 `done` 回调，而非 `change` 回调。
|