带有字符串值的Jquery ui滑块? [英] Jquery ui slider with string values?

问题描述

我正在使用 jQuery UI 滑块.

这是我正在使用的代码:

Here is the code i am using:

$(function() {
        $( "#slider" ).slider({
            value:1,
            min: 0,
            max: 5,
            step: 1,
            slide: function( event, ui ) {
                $( "#amount" ).val( "$" + ui.value );
            }
        });
        $( "#amount" ).val( "$" + $( "#slider" ).slider( "value" ) );
    });

将有 5 个步骤，我想在每个步骤中显示字符串而不是数字:

There will be 5 steps and I'd like to show the strings in each step instead of the numbers:

1=very sad
2=sad
3=not so sad
4=happy
5=very happy

我该怎么做?

推荐答案

您可以将步骤标签放在一个数组中，然后使用滑块的值作为该数组的索引:

You can put your step labels in an array, then use the slider's value as an index into that array:

var steps = [
    "very sad",
    "sad",
    "not so sad",
    "happy",
    "very happy"
];

$(function() {
    $("#slider").slider({
        value: 1,
        min: 0,
        max: 4,
        step: 1,
        slide: function(event, ui) {
            $("#amount").val(steps[ui.value]);
        }
    });
    $("#amount").val(steps[$("#slider").slider("value")]);
});

这篇关于带有字符串值的Jquery ui滑块?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！