jQuery UI滑块步骤

时间:2017-12-18 09:08:02

标签: jquery jquery-ui jquery-ui-slider

我有一个jquery UI滑块,我注意到如果最大值和最小值之间的差异不是步骤选项的精确倍数,则滑块无法正常工作。

例如: 分:6900 最大:79900 步骤:1500

当我移动最大光标时,最大可达值为78900((78900-6900)/ 15 = 48),下一个为80400。

如何达到最大值(79900)?

谢谢

1 个答案:

答案 0 :(得分:2)

您可以将最大值设置为步骤的倍数:

  var range = Math.floor((max - min) / step) + 1;
  var max_calc = min + range * step;

然后在幻灯片处理程序中将值限制为原始最大值:

slide: function(event, ui) {
  var v1 = Math.min(ui.values[0], max);
  var v2 = Math.min(ui.values[1], max);
  $("#slider-price").slider("values", 0, v1);
  $("#slider-price").slider("values", 1, v2);
  $("#amount").val("$" + v1 + " - $" + v2);
}

你的小提琴相应调整:https://jsfiddle.net/beaver71/d8wvke7u/