项目地址 返回首页

移动结束显示

$('#range1').range({
	min:0,
	max:50,
	value:40,
	steps:5,
	onChange:function(status){
		$('#input1').val(status.value);
	}
});

移动过程中显示

$('#range2').range({
	min:10,
	max:62,
	value:40,
	steps:5,
	onSlide:function(status){
		$('#input2').val(status.value);
	}
});

调用方法:

$(selector).range(options,callback(api));

options参数

参数 默认值 说明
valueCls value 当前有效值范围显示class
handleCls handle 拖动滑块class
min 0 变化范围的最小值
max 100 变化范围的最大值
value 1 默认显示的值
steps 1 每次移动的步长
type 'outer' outer进度计算以进度条宽为准,inner进度计算需扣除条滑块宽
onSlide(obj) [无] 当前值变化时触发的事件,传入对象:event为事件,value为当前值
onChange(obj) [无] 当前值变化后触发的事件,传入对象:event为事件,value为当前值

callback(api)参数

方法 说明
setValue(value) 设置值
resize() 重置尺寸