基于Bootstrap+jQuery slider的滑块取值插件

使用方法：

引入必要的css和js文件

<link href="css/bootstrap.min.css" rel="stylesheet">
<link href="css/bootstrap-slider.css" rel="stylesheet">
<script type='text/javascript' src="js/jquery.min.js">script>
<script type='text/javascript' src="js/bootstrap-slider.js">script>

调用.slider()方法

// Instantiate a slider
var mySlider = $("input.slider").slider();
 
// Call a method on the slider
var value = mySlider.slider('getValue');
 
// For non-getter methods, you can chain together commands
    mySlider
        .slider('setValue', 5)
        .slider('setValue', 7);

如果已经有一个jQuery插件的slider()绑定在该命名空间中，那么bootstrap slider插件会一个候补的调用方法bootstrapSlider。

// Instantiate a slider
var mySlider = $("input.slider").bootstrapSlider();
 
// Call a method on the slider
var value = mySlider.bootstrapSlider('getValue');
 
// For non-getter methods, you can chain together commands
    mySlider
        .bootstrapSlider('setValue', 5)
        .bootstrapSlider('setValue', 7);

使用原生js调用bootstrap slider

在DOM中创建一个input元素，然后通过选择器为该input元素创建slider实例。

// Instantiate a slider
var mySlider = new Slider("input.slider", {
    // initial options object
});
 
// Call a method on the slider
var value = mySlider.getValue();
 
// For non-getter methods, you can chain together commands
mySlider
    .setValue(5)
    .setValue(7);

配置参数

以下这些参数也可以通过一个data属性（data-slider-foo）或作为slider对象的一部分来调用。