jquery-ui - 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#slider_style作为单词 PLAY 出现在 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 作为值取决于滑块。这是你的意思吗？