如何让jQuery-UI滑块使用非数值？

Question

我已阅读API文档,所有内容都涉及数字

http://api.jqueryui.com/slider/

是否有可能将滑块设为非数字,例如1月到12月,我将如何进行此操作/是否有任何示例？

Answer 1

看到这里工作jsfiddle.

$(function () {
    var months = ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'];
    $('#slider').slider({
        min: 0,
        max: 11,
        step: 1,
        create: function (event, ui) {
            $('#selectedMonth').text(months[0]);
        },
        slide: function (event, ui) {
            $('#selectedMonth').text(months[ui.value]);
        }
    });
});

关于几个月的例子,这将是一个创建数组的简单方法.使用该slide事件,您可以轻松使用该ui.value值来选择数组的元素.若要不允许任何没有月份(> 12)的max选择,请使用该选项并将其设置为11. min当然是0,因为数组以索引0开头.

我刚刚在用户第一次使用滑块之前的一个月添加了create事件以填充selectedMonth范围.

为了完整性,文档引用:

• 分
• 最大
• 步
• 创建
• 滑动