php - Jquery 滑块输入的键盘值有效，但尽管滑块没有值

Question

下面是我的代码...

    <script>
    $(function() {
     $( "#slider" ).slider({
            value:10,
            min: 1,
            max: 400,
            step: 1,
            slide: function( event, ui ) {
                               //Its setting the slider value to the element with id "amount"
                $( "#border_me" ).val( ui.value );
            }
        });
    });
    </script>

和我的html代码..

<input id='border_me' class='border_width' value='66' />

我正在使用上面的滑块显示来自服务器页面的一些数据......if i enter value using keyboard and hit enter or mouse click它工作正常，但its not taking the value from slider我在值字段滑块值中看到它正在更新不幸的是，如果我按下回车键或鼠标点击什么也没有发生......可能是什么问题？

Answer 1

您正在更改输入中的值，但实际上并未应用该值。您需要监听输入中的值变化然后应用它。

jsFiddle

HTML

<input id='border_me' class='border_width' value='66' />
<div id="slider"></div>

JavaScript

$("#slider").slider({
    value: 10,
    min: 1,
    max: 400,
    step: 1,
    slide: function (event, ui) {
        //Its setting the slider value to the element with id "amount"
        $("#border_me").val(ui.value);
    }
});

$("#border_me").on('change', function () {
    $("#slider").slider("value", this.value);
});