jQuery slider 限制，最小值/最大值从 0 到 100

Question

默认 jQuery slider 0 到 100，我只需要限制在 20% 到 50% 之间。 只有 1 个 handle (不是 2 个)

js:

$('div').slider({
    //range: 'max',
    step: 1,
    min: 20,
    max: 50,
    slide: function(event, ui){
        console.log(ui.value);
    }
});

这是我需要的图片:

Answer 1

您可以在 slide 属性提供的函数中测试 slider 的当前值。如果该值太低或太高，只需返回 false 即可中止进程。

var sliderMin = 20,
    sliderMax = 50;

$('#slider').slider({
    step: 1,
    min: 0,
    max: 100,
    value: sliderMin,
    slide: function( event, ui ) {
      var amount = ui.value;
      if (amount < sliderMin || amount > sliderMax) {
        return false;
      } else {
        $("#amount").val(amount);
      }
    }
});

$("#amount").val(sliderMin);

你可以在这个jsFiddle中测试一下.