我正在開發一個快速解決方案，它使用帶多個手柄的Slider來定義動態佈局的寬度。具有多個句柄的JQuery UI滑塊：如何阻止句柄過關？
我試圖使用ExtJS3和最新的JQuery UI。
在ExtJS中，您可以限制手柄，使其不交叉彼此，這對我所需的用戶界面來說是一種非常直觀的方法，但是我有理由不使用ExtJS作爲「島嶼」在JQuery的海洋中。
那麼，有沒有人知道一個祕密屬性，或一些代碼約束JQuery滑塊中的多個句柄？
爲了清楚起見：如果您有一個帶2個手柄的滑塊，一個在40，一個在60;約束會阻止您將手柄從60拖動到20，而無需先移動手柄40。
在幻燈片事件中，你可以通過檢查滑塊值，並返回true，讓幻燈片或假，以防止它（更多信息jQuery UI的文檔）限制手柄運動
你用什麼代碼爲Jquery滑塊？看着range slider demo，它有兩個手柄，它不可能穿過它們。
我使用的是JQuery UI Slider，但我已經定義了多個句柄，總共可以有6個欄。我可以嘗試在每對之間設置一個範圍，而不是設計它，雖然... – 2010-08-17 08:16:32
由於@madcapnmckay指出，如果您的滑塊有兩個手柄，並且選項中的手柄不能相互拖動。
我在那裏沒有適當限制問題，但事實證明，我有一個字符串'true'，而不是一個布爾true
檢查的此解決方案：
slide : function(event, ui) {
//Actual Handle Selected
var handleIndex = $(ui.handle).index()-1;
var diffA, diffB;
//Check with right handles
if(handleIndex > 0)
diffA = ui.values[handleIndex] - ui.values[handleIndex-1];
//Check with left handles
if(handleIndex < ui.values.length-1)
diffB = ui.values[handleIndex+1] - ui.values[handleIndex];
if (diffA <= 0 || diffB <= 0) { /*checks for the values and compares*/
return false;
}
}
你真的想讓第一個句柄的索引爲-1嗎？ – 2012-09-07 04:51:11
這太棒了......我想知道......現在它可以防止左手柄的交叉，但是您仍然可以將手柄拖過右手柄。什麼需要防止任何交叉？ – 2015-03-02 20:51:29
我有點在這裏聚會晚了，但我想分享我最緊湊，但可讀的方式來做到這一點。從技術上講，它與@tototresde的答案非常相似。
slide: function (e, ui) {
// Prevent crossing and overlapping of slider handles.
if (ui.values[(ui.handleIndex - 1)] >= ui.value ||
ui.values[(ui.handleIndex + 1)] <= ui.value) {
return false;
}
}
是的，這確實有效 - 猜測我只是希望有一個祕密的「約束：真正的」參數或東西:) 事實證明，真正需要的只是從滑塊中排序'值'數組，然後交叉並不重要。不過不用擔心，你的答案是最準確的，所以你得到滴答聲，謝謝！ – 2010-08-17 10:18:36