在 Nouislider 中将点值显示为数字范围

Question

我用这段代码创建了一个 nouislider：

<div id="slider"></div>
<script>
var slider = document.getElementById('slider');
noUiSlider.create(slider, {
    start: 0,
    step: 1,
    tooltips: false,
    connect: 'lower',
    range: {
        min:[559],
            '1%':[559,1],
            '25%':[560,60],
            '50%':[620,55],
            '75%':[675,75],
            '100%':[725],max:[725]
    },
    pips: {
        mode: 'values',
        values: [559,560,620,675,725],
        density: 20 }
       
   
});
</script>

我的点值显示为，

但我希望它以这种方式出现：

请问我怎样才能做到这一点？我可以在 pip 值中输入 HTML 值还是必须使用 jquery？

Answer 1

pips 选项 accepts a format parameter。您可以在那里传递一个to 函数来格式化每个值，如问题中所述。