Jquery UI Slider - 为值分配名称

Question

我需要为 Jquery UI 滑块的值分配名称 - 这可能吗？

到目前为止的代码如下：

<script type="text/javascript">
    $(function() {
        $("#slider_style").slider({
            value:2,
            min: 1,
            max: 3,
            step: 1,
            slide: function(event, ui) {
                $("#style_type").val( ui.value );
            }
        });
        $("#style_type").val( $("#slider_style").slider("value") ); 
    });
</script>

基本上我想让 1 作为单词 PLAY 出现在 #slider_style div 中，2 作为单词 HEAL，3 作为 RELAX - 谁能指出这是如何实现的？

Answer 1

您可以只使用查找对象来获取值：

var lookup = {
    1: 'PLAY',
    2: 'HEAL',
    3: 'RELAX'
}

然后在您的 slide 函数中设置该对象的值：

...
slide: function(event, ui) {
    $('#style_type').val(lookup[ui.value]);
}

这将使 #style_type 获得 PLAY、HEAL 或RELAX 值取决于滑块。这是你的意思吗？