jQDateRangeSlider带步骤月份：1不突出显示结束月份

Question

我正在我的网页上使用jQRangeSlider构建一个月份范围选择器。这是 live demo at jsfiddle 。这是我正在使用的代码。

var months = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sept", "Oct", "Nov", "Dec"];

$("#slider").dateRangeSlider({
    bounds: {
        min: new Date(2012, 0, 1),
        max: new Date(2012, 11, 31, 12, 59, 59)
    },
    defaultValues: {
        min: new Date(2012, 1, 10),
        max: new Date(2012, 4, 22)
    },
    scales: [{
        first: function (value) {
            return value;
        },
        end: function (value) {
            return value;
        },
        next: function (value) {
            var next = new Date(value);
            return new Date(next.setMonth(value.getMonth() + 1));
        },
        label: function (value) {
            return months[value.getMonth()];
        },
        format: function (tickContainer, tickStart, tickEnd) {
            tickContainer.addClass("myCustomClass");
        }
    }],
    // my code that added step 1 month and formatted labels.
    step: {
        months: 1
    },
    formatter: function (val) {
        var days = val.getDate(),
            month = val.getMonth() + 1,
            year = val.getFullYear();
        return month + "/" + year;
    }
    // end my code
});

我从here的jQRangeSlider网站获得了此代码。我通过在其末尾添加我的自定义代码进行修改。

问题：

如上面的屏幕截图所示，除结束日期选择外，一切正常。在这个例子中，我希望滑块突出显示6月份，因为它在标签中显示，但它没有选择。

可能的解决方案：

修改上面的代码以显示正确的行为，即突出显示完整的结束月份，就像突出显示完整的开始月份一样。

Answer 1

您可以在更改值上添加活页夹

$("#slider").bind("valuesChanged", function(e, data){
  console.log("Values just changed. min: " + data.values.min + " max: " + data.values.max);

$(".ui-rangeSlider-rightLabel .ui-rangeSlider-label-value").html("update with the max-1 ")
});