Question

我创建了jquery滑块，工作正常。我将滑块划分为三个类别。

    var setRatingValue = function() {
        // Set text
        var ratingValue = $("#rating-slider").slider("value");
        $("#rating-value").text('yellow');
        // Change the background colour of the slider
        //var hsl = "hsl("+ratingValue+", "+50+"%, "+50+"%)";
var color = '';
if(ratingValue > 0 & ratingValue <= 30)
    color = 'red';

else if(ratingValue > 30 & ratingValue <= 70)
    color = 'blue';

else if(ratingValue > 70 & ratingValue < 100)
    color = 'green';

        $(".ui-slider-range").css("background", color);
        // Set text colour
        $("#rating-value").css("color", color);
    };

Slider看起来像这样：http://jsfiddle.net/BxY99/2/这与我使用的不一样。

它需要连续的滑块值。

我想提醒滑块的值仅当它的值从这些类别之一变化时（0到30,31到70,71到100）。

目前会发生什么事情，它会在移动滑块时提醒每个值。

任何帮助都很明显

Answer 1

您可以使用幻灯片事件或API所拥有的更改事件

这些事件作为函数参数传递event和ui对象，您可以通过ui.value检索值，

然后你可以使用：

$(".slider").slider({
    value: 50,
    slide: function (event, ui) {
        myFunction(event, ui);
    }
});

捕获jquery滑块的值

1 个答案:

Demo