Nouslider时间滑块返回不正确的时间戳

时间:2018-11-14 04:29:14

标签: javascript timestamp nouislider

我正在使用nouilsider制作时间滑块。我有类似[1979-03,1979-06,1979-09,1979-12,1980-03]的滑块的年月值,间隔为三个月。因为我的起始值为1979-03,它应该返回1979-03的时间戳,但是当我检查时间戳的月份时,它返回的是1而不是3。其次,我的滑块只滑动了一点。这是我的代码< / p>

    function timestamp(str) {
      var x = (new Date(str).getTime());
      return x;
    }
    noUiSlider.create(stepSlider, {
            start: timestamp('1979-01'),
            range: {
                'min': timestamp('1979-01'),
                'max': timestamp('1979-06')
            },
            step: 3*30 * 24 * 60 * 60 * 1000


        });
stepSlider.noUiSlider.on('update', function (values, handle) {
   var x = parseInt(values[handle]);
   var date = new Date(x);
   var month = date.getMonth()
   console.log(month)

1 个答案:

答案 0 :(得分:0)

您的step的值3*30 * 24 * 60 * 60 * 1000与整个月都不匹配。并非所有月份都有30天,也不是所有日子都有24 * 60 * 60秒。

由于您使用固定数量的步骤,因此最好使用整数并将输出映射到月份:

var slider = document.getElementById('slider');

noUiSlider.create(slider, {
    start: 0,
    range: {
        'min': 0,
        'max': 5
    },
    format: {
        to: function(value) {
            return ['1979-01', '1979-02', '1979-03', '1979-04', '1979-05', '1979-06'][Math.round(value)];
        },
        from: Number
    },
    step: 1
});

slider.noUiSlider.on('update', function( values, handle ) {
    console.log(values[handle]);
});