jquery - 不规则的 Bootstrap slider 步长值

标签 jquery twitter-bootstrap slider bootstrap-slider

我正在使用 Bootstrap slider http://seiyria.com/bootstrap-slider/ 我想选择不规则的步长值,例如 14、90、360 天。

Example Link

<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)
            })
           ;

有关如何仅选择那些定义值 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>

Example Plunker

关于jquery - 不规则的 Bootstrap slider 步长值,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32318315/

相关文章:

javascript - Zepto 相当于 jQuery prev([selector])

jquery - 如何制作 Bootstrap 网格系统元素,砖石风格?

wpf - Caliburn.Micro Action 不起作用

javascript - 响应图像和不同的图片分辨率

jquery - 如何刷新日期选择器?函数 .datePickerMultiMonth()

javascript - jQueryUI Modal - 添加多个按钮

javascript - 发现特殊字符时 FullCalendar 停止加载

html - img-circle 超出边距

css - 具有多个框架的单页 Web 应用程序具有重复的类名

javascript - Bxslider字幕动画