jQuery-UI多范圍滑塊-獲取值

Question

我正在使用這個 jQuery-UI插件進行多范圍輸入。 它工作得很好，除了一部分，我無法獲取其值。 有人使用過此插件嗎？ 如何獲取值以在程序中使用它們？ 我似乎找不到獲取數據的方法。 沒有描述該操作方法的文檔。

var ranges_array = [
  {
    id: 1,
    startValue: 2000,
    endValue: 8000,
    color: "rgb(27, 64, 194)"
  }
];
//
$(function() {
  $('#budget-range').rangeSlider({
    min: 0,
    max: 10000,
    ranges: ranges_array
  });
});

Answer 1

定義rangeSlider時，您可以創建rangeSlide事件，該事件可以使用事件的ui參數讀取滑塊的值：

$(document).ready(function() {
  var currentStartValue = '';
  var currentEndValue = '';

  $('#budget-range').rangeSlider({
    min: 0,
    max: 10000,
    ranges: ranges_array,
    rangeSlide: function(event, ui) {
      currentStartValue = ui.range.startValue; // set the current start value of the range
      currentEndValue = ui.range.endValue; // set the current end value of the range
    }
  });

  function logRangeValues() {
    console.log('Start value: ' + currentStartValue);
    console.log('End value: ' + currentEndValue);
  }
});