Jquery滑块输入的键盘值有效,但滑块不取值

Jquery slider entered keyboard value works but though slider its not taking value

本文关键字:键盘 输入 Jquery 有效      更新时间:2023-09-26

下面是我的代码。。。

    <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我在值字段中看到它滑块值正在更新,不幸的是,如果我按enter键或鼠标点击,什么都不会发生。。。。。问题出在哪里?

您正在更改输入中的值,但实际上并没有应用该值。你需要倾听输入中的值变化,然后应用它

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);
});