不规则 bootstrap 滑块步长值
Irregular bootstrap slider step values
我正在使用 bootstrap 滑块 http://seiyria.com/bootstrap-slider/
我想 select 不规则步长值,例如 14、90、360 天。
<input id="ex1" data-slider-id='ex1Slider' type="text" data-slider-step="1" data-slider-value="14" data-slider-ticks="[14, 90, 360]"
data-slider-ticks-labels='["14 days", "90 days", "1 year"]'
/>
var r = $('#ex1').slider()
.on('slide', function(data){
$("#ex6SliderVal").text(data.value)
})
;
关于如何 select 仅那些定义的值 14、90、360 等的任何建议。
作者seiyria解决了这个问题
$(document).ready(function(){
var realValues = [14, 60, 120, 365];
var labelValues = ['14d', '60d', '120d', '365d'];
var r = $('#ex1').slider({
max: 3,
min: 0,
step: 1,
ticks: [0, 1, 2, 3],
formatter: function(val) {
return labelValues[val];
}
})
.on('change', function(data){
console.log(data);
$("#ex6SliderVal").text(data.value.newValue + ' ' + realValues[data.value.newValue])
})
;
})
<input id="ex1" data-slider-id='ex1Slider' type="text"
/>
<span id="ex6CurrentSliderValLabel">Current Slider Value: <span id="ex6SliderVal">3</span></span>
我正在使用 bootstrap 滑块 http://seiyria.com/bootstrap-slider/ 我想 select 不规则步长值,例如 14、90、360 天。
<input id="ex1" data-slider-id='ex1Slider' type="text" data-slider-step="1" data-slider-value="14" data-slider-ticks="[14, 90, 360]"
data-slider-ticks-labels='["14 days", "90 days", "1 year"]'
/>
var r = $('#ex1').slider()
.on('slide', function(data){
$("#ex6SliderVal").text(data.value)
})
;
关于如何 select 仅那些定义的值 14、90、360 等的任何建议。
作者seiyria解决了这个问题
$(document).ready(function(){
var realValues = [14, 60, 120, 365];
var labelValues = ['14d', '60d', '120d', '365d'];
var r = $('#ex1').slider({
max: 3,
min: 0,
step: 1,
ticks: [0, 1, 2, 3],
formatter: function(val) {
return labelValues[val];
}
})
.on('change', function(data){
console.log(data);
$("#ex6SliderVal").text(data.value.newValue + ' ' + realValues[data.value.newValue])
})
;
})
<input id="ex1" data-slider-id='ex1Slider' type="text"
/>
<span id="ex6CurrentSliderValLabel">Current Slider Value: <span id="ex6SliderVal">3</span></span>