noUiSlider 问题 - 无法更新关联的输入字段

Question

我想在更新 noUiSlider 时用值更新两个输入字段。我已经尝试了过去 24 小时的所有排列和组合，但都失败了。

这是我遵循的教程 https://jsfiddle.net/skrb5cg3/138/

这是我的代码。我想在更改滑块时更新输入字段。 https://jsfiddle.net/rx8hjf5e/

$(document).ready(function(){
var rangeSliderFrom = document.getElementById('rangeSliderFrom'),
rangeSliderTo = document.getElementById('rangeSliderTo');

var sliderFormat = {
to: function(val) {
    val = Math.ceil(val);
    hours = convertToHour(val);
    minutes = convertToMinute(val,hours);       
    return formatHoursAndMinutes(hours,minutes);
  },
from: function(val) {
  return val;
}
};

var convertValuesToTime = function(values,handle){
var hours = 0, 
  minutes = 0;
if(handle === 0){
  hours = convertToHour(values[0]);
  minutes = convertToMinute(values[0],hours);
  rangeSliderFrom.value = hours;
  return;
};
hours = convertToHour(values[1]);
minutes = convertToMinute(values[1],hours);
rangeSliderTo.value = hours;
};

var convertToHour = function(value){
var p = parseFloat(Math.floor(value / 60));
console.log(p);
return p;
};

var convertToMinute = function(value,hour){
ret = value - hour * 60;
if(ret !== 30 && ret !== 0 ) {
  // cool hack to round to the nearest n
  i = ret, n = 30;
  ret = ((i % n) > n/2) ? i + n - i%n : i - i%n;
}
return parseFloat(ret);
};

var formatHoursAndMinutes = function(hours,minutes){
if(hours.toString().length == 1) hours = '0' + hours;
if(minutes.toString().length == 1) minutes = '0' + minutes;
return hours+':'+minutes;
};

// 0 = initial minutes from start of day
// 1440 = maximum minutes in a day
// step: 60 = amount of minutes to step by.
var initialStartMinute = 0, initialEndMinute = 1440, step = 60;

function createSlider(vals) {
var slider = document.getElementById("rangeSlider");
window.slider = noUiSlider.create(slider, {
  start: vals,
  connect: true,
  step: step,
  range: {
    'min': initialStartMinute,
    'max': initialEndMinute
  },
  pips: { // Show a scale with the slider
    mode: 'steps',
    stepped: true,
    density: 4,
    filter: function(value, type) {
      if(value == initialEndMinute || value == initialEndMinute) {
        return 1;
      } else if(value % 360 == 0 ) {
        return 1;
      }
    },
    format: sliderFormat
  },
  tooltips: true,
  format: sliderFormat,
  direction: 'ltr', // Put '0' at the bottom of the slider
});
window.slider.on('update',function(values,handle){
  convertValuesToTime(values,handle);
});
}

 createSlider([240,  1280]);    
});

知道代码失败的原因。抱歉，如果这是一个愚蠢的问题，我是编码新手，无法找出为什么会发生错误。

Answer 1

为了回答我自己的问题，我进行了以下修改及其工作。

......
var convertValuesToTime = function(values,handle){
var hours = 0, 
    minutes = 0;
if(handle === 0){
    rangeSliderFrom.value = values[0];
    hours = convertToHour(values[0]);
    minutes = convertToMinute(values[0],hours);
    return;
};
rangeSliderTo.value = values[1];
hours = convertToHour(values[1]);
minutes = convertToMinute(values[1],hours);
};
.....

noUiSlider 问题 - 无法更新关联的输入字段

Issue with noUiSlider - failing to update associated input field

javascript

jquery

nouislider