如何在Bootstrap范围滑块中选择反向范围？

Question

我用过Bootstrap range slider，但我有2个问题完全困扰我。

  

我的问题是我如何选择反向范围，例如我有一个值为1到10的滑块，那么我必须选择9到3怎么做？

在这里，我有一个要选择月份范围的滑块，如八月-2月 我该怎么办？？

  

另一个问题是如何添加两个手柄的标签？

这是我的html代码，

CAP_DAC_OVERRIDE

JavaScript是

<input id="ex1" type="hidden" data-clear-delay="true" data-provide="slider" data-slider-selection="none" data-slider-value="[0,100]" data-slider-ticks="[1,2,3,4,5,6,7,8,9,10,11,12]" data-slider-ticks-labels='["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"]' data-slider-ticks-positions="[0, 9.09, 18.18, 27.27, 36.36, 45.45, 54.54, 63.63, 72.72, 81.81, 90.90, 100]" data-val="true" name="prefered_travel_period" value="" />

请帮助我，谢谢。

Answer 1

为了支持选择新年的月份范围，您可以简单地在两个通用年份创建滑块，而不是仅覆盖一个通用年份的月份范围。

例如：

<input id="ex1" type="hidden" data-clear-delay="true" data-provide="slider" data-slider-selection="none" data-slider-value="[0,100]" data-slider-ticks="[1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23,24]" data-slider-ticks-labels='["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec","Jan2","Feb2","Mar2","Apr2","May2","Jun2","Jul2","Aug2","Sep2","Oct2","Nov2","Dec2"]' data-slider-ticks-positions="[0, 4.34, 8.69, 13.04, 17.39, 21.73, 26.08, 30.43, 34.78, 39.13, 43.47, 47.82, 52.17, 56.52, 60.86, 65.21, 69.56, 73.91, 78.26, 82.60, 86.95, 91.30, 95.65, 100]" data-val="true" name="prefered_travel_period" value="" />

什么是“直觉”总是一个观点，但我认为这比任何反概念都好，例如例如“请选择您不想使用的月份”。

Answer 2

您有：data-slider-ticks和data-slider-ticks-labels

如果只想显示1月-6月，则必须将其更改为：

• data-slider-ticks="[1,2,3,4,5,6]"

• data-slider-ticks-labels='["Jan","Feb","Mar","Apr","May","Jun"]'