使用jQuery的ui范围滑块具有相同的句柄值不重叠

我正在使用jQuery的ui滑块。在范围滑块中，如果我使用两个手柄选择相同的范围，则一个手柄隐藏在另一个手柄后面。如果选择相同的范围，我只想满足两个手柄。请帮助我。使用jQuery的ui范围滑块具有相同的句柄值不重叠

$("#dvSliderRange2").slider({ 
    range: true, 
    min: 0, 
    max: 100, 
    values: [20, 40], 
    step: 10, 
    slide: function(event, ui) { 
     if (ui.values[0] == ui.values[1]) { 
      return false; 
     } 
     $("#lblRange2").text(ui.values[0] + " - " + ui.values[1]); 
    } 
});

来源

2012-04-28 supersaiyan

如果值与它们应该重叠的值相同。如果你想同时看到两个处理程序，而不是只使用css来定位它们，那么它们都可以随时使用。 – 2012-09-24 14:55:04

对于“满足这两个处理”的含义，你能更具体一些吗？ – karancan 2013-03-24 20:58:50

我想它不应该重叠，如果价格或时间是相同的.. – supersaiyan 2013-03-27 09:27:40

我有一个解决方案，使用下面的一些CSS。这相当于在元素中添加一个类。然后Css定位这些手柄，使它们都可见。

http://jsfiddle.net/dhQk/jTx89/

然而，在交互性的情况。没有对滑块代码进行一些修改是不可能的。我已经包含来自jQuery滑块1.10.2的src。从src的第176行开始。

this.handles.each(function(i) { 
    var thisDistance = Math.abs(normValue - that.values(i)); 
    if ((distance > thisDistance) || 
     (distance === thisDistance && 
      (i === that._lastChangedValue || that.values(i) === o.min))) { 
     distance = thisDistance; 
     closestHandle = $(this); 
     index = i; 
    } 
});

正如你由此可以看出，它的手柄是不实际选择通过处理您选择，但通过编程你点击其中的距离。不知道为什么决定这是他们如何去做，但它不会让你分别与他们互动，一旦他们是相同的价值;

来源

2013-04-13 00:25:47

其实我只是想通了，他们这样做，让你点击栏上的任何地方，并能够开始滑动。 – 2013-04-13 00:27:46

使用jQuery的ui范围滑块具有相同的句柄值不重叠

回答

相关问题