JSFiddle 不允许我设置输入值

Question

我正在我的一个页面中实现 Jquery 数字框。我必须从具有最小值和最大值的用户那里获取数字输入。问题是我设置了最小值并尝试使用键盘输入值，它自动显示最小值而不让我输入完整值。

例如在演示中：Demo Link Here

max = $this.spinner('option', 'max'),
min = $this.spinner('option', 'min');

Min 设置为 100，Max 设置为 1000，但是如果我想从键盘输入 500，一旦我按下 5，它会自动设置它的值 100。

有没有人遇到同样的问题？

Answer 1

我会将您代码中的 .on('input'...) 更改为 .on('blur'...)，并且只有在我知道用户 "finished" 输入他的输入之后才更改值，而不是像您的那样在此之前例如。

Answer 2

我对你的代码做了一些修改，试试这个 plunker:

HTML:

<input type="text" value="0" >

JS:

$("input").spinner({
    max: 1000,
    min: 100
}).on('blur', function () {
    if ($(this).data('onInputPrevented')) return;
    var val = this.value,

        $this = $(this),
        max = $this.spinner('option', 'max'),
        min = $this.spinner('option', 'min');

        // only allow numbers
       $(this).val($(this).val().replace(/[^0-9]/g, ''));

    // check input value
        if(val< 100 ){
            console.log(val.toString().length)
           if(val.toString().length == 1)
            $("input").val(val + 0 + 0);
            if(val.toString().length == 2)
                $("input").val(val + 0);


        }

});

JSFiddle 不允许我设置输入值

JSFiddle does not let me set input value

jquery

jquery-ui

spinner