Question

基本滑块，范围从10-1000到每步之间20（10-30-50等）。

我想要做的是，在最后一步（1000）的值之前添加/注入一个字符。

是的，它不会以“560 kr / h”或“400 kr / h”的速度返回，这一切都很好。但是在1000时，我希望它变成“＆gt; 1000 kr / h”。

以下是我的设置。

HTML

<label for="value1" class="value">Mitt pris:</label>
<input type="text" id="value1" />kr/h
<div id="slider1"></div>

的jQuery

$(function() {
    $( "#slider1" ).slider({
        value: 300,
        min: 10,
        max: 1000,
        step: 20,
        slide: function( event, ui ) {
            $( "#value1" ).val(ui.value );}
    });
        $( "#value1" ).val( $( "#slider1" ).slider( "value" ) );

});

Answer 1

虽然还有其他方法可以做到这一点，但设置值后的简单if语句应该是您所需要的：

    slide: function( event, ui ) {
        $( "#value1" ).val(ui.value );
        if ($( "#value1" ).val == 1000) { $( "value1" ).val(">1000");} }

这是一种更简洁的方式，但可能更难阅读

    slide: function( event, ui ) {
        $( "#value1" ).val(ui.value == 1000 ? ">1000" : ui.value );}

实际上将此settor设为函数是一个很好的设计，因此您可以在设置value1的两个地方使用它：

$(function() {
    var setValue = function(value) {
        $("#value1").val(value == 1000 ? ">1000" : value); };
    $( "#slider1" ).slider({
        value: 300,
        min: 10,
        max: 1000,
        step: 20,
        slide: function( event, ui ) {
            setValue(ui.value);}
    });
    setValue($( "#slider1" ).slider( "value" ) );
});

Answer 2

尝试：

$(function() {
    $( "#slider1" ).slider({
        value: 300,
        min: 10,
        max: 1000,
        step: 20,
        slide: function( event, ui ) {             
            $( "#value1" ).val(ui.value == 1000 ? '> 1000' : ui.value );
        }
    });
    $( "#value1" ).val( $( "#slider1" ).slider( "value" ) );
});

这是fiddle

jQuery UI - 在最后一个值之前注入/添加字符

2 个答案: