jQuery旋鈕停在最大值

Question

我使用的jQuery knob與選項data-displayPrevious=true。

我需要在行爲變化不大：

如果用戶改變價值高達應該停在最大值和最大溢出後不跳轉到最低限度。如果用戶改變價值，它應該至少停止。 完全是這樣的：http://demo.tutorialzine.com/2011/11/pretty-switches-css3-jquery/

你能幫我解決這個問題嗎？

Answer 1

這是你可以做的一個粗略的例子。 http://jsfiddle.net/KjtSP/

它有一些問題，比如如果你回去時不繼續拖動，但除此之外它應該作爲你理念的一個很好的基礎。基本上，我正在做的是檢查旋鈕在設置之前想要設置的值，並且如果它符合超出最大值或低於最小值的標準，我可以取消當前的鼠標事件。

通過返回false，我們阻止插件設置它接收到的值。

var knob = $(".dial"); 
lastValue = 0; 
max = 100; 
min = 0; 
variance = Math.floor(max/5); 

knob.knob({ 
    "change": function(v) { 
     if (v > max - variance && lastValue < min + variance) { 
      knob.val(0).change(); 
      return false; 
     } else if (v < min + variance && lastValue > max - variance) { 
      knob.val(100).change(); 
      return false; 
     } 
     lastValue = v; 
    } 
});​ 

更新

由於返回false 確實防止新值的設定，你可以做的不叫mouseup ERGO允許進程的繼續。稍微調整我的代碼，導致以下fiddle，允許你做你想要的。

只有的怪癖你這段代碼遇到的是，如果你去的公差或閾值在代碼中設置，你的旋鈕將去那個價值，但我個人認爲這是它應該如何工作。