ion RangeSlider: customize grid in case of custom

问题:

I have the following slider setup:

$("#experience-filter").ionRangeSlider({
    values: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, '15+'],
    grid: true,
    force_edges: true,
    step: 5,
    onFinish: function (data) {
        $("#experience-filter").parent().find('.check input[type="checkbox"]').prop('checked',true);
    }
});

I prefer not to have all the values in my grid. But have it like 0, 5, 15+. is this possible?

回答1:

In your case, it would be much easier to try a different approach:

http://jsfiddle.net/IonDen/263cr7g9/

var $range = $(".js-range-slider");
var $result = $(".js-result");

function transform (n) {
    if (n > 15) {
        return "15+";
    }

    return n;
}

$range.ionRangeSlider({
    type: "single",
    min: 0,
    max: 16,
    grid: true,
    grid_snap: true,
    step: 5,
    prettify: function (n) {
        return transform(n);
    }
});