3

我正在使用带有选项的jQuery 旋钮data-displayPrevious=true。

我需要一些行为上的改变：

如果用户向上更改值，它应该在最大值处停止，并且在溢出最大值后不会跳到最小值。如果用户更改值，它应该至少停止。完全像这样：http ://demo.tutorialzine.com/2011/11/pretty-switches-css3-jquery/

你能帮我解决这个问题吗？

4

1 回答 1

2

这是您可以执行的方法的粗略示例。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允许进程继续的尔格。稍微调整一下我的代码，得到以下fiddle，可以让你做你想做的事。

您遇到此代码的唯一怪癖是，如果您超过代码中设置的容差或阈值，您的旋钮将达到该值，但我个人认为它应该是这样工作的。

于 2012-12-05T09:10:50.607 回答