如何使输入字段只接受200到500之间的数字？

Question

I want to make an input field, where the user can insert only a number bigger than 200 and lower than 500. My problem is if I want to write for example "230" then the field doesn't allow me to, because it thinks I want to write "2".

 var t = false $('.myinput').focus(function () { var $this = $(this) t = setInterval( function () { if (($this.val() < 200 || $this.val() > 500)) { if ($this.val() < 200) { $this.val(200) } if ($this.val() > 500) { $this.val(500) } $('.error').fadeIn(1000, function () { $(this).fadeOut(500) }) } }, 50) }) $('.myinput').blur(function () { if (t != false) { window.clearInterval(t) t = false; } }) 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <input class="myinput" type="number" value="200" min="200" max="500"> <p class="error" style="display:none">Accepting Only values 200-500</p> 

Answer 1

Why not just use a range?

 $('p').text($('input[type="range"]').val()); $('input[type="range"]').on('change', function(){ val = $('input[type="range"]').val(); $('p').text(val); }); 

 <script src="http://code.jquery.com/jquery-3.1.1.js"></script> <input type="range" min="200" max="500"/> <p></p> 

Answer 2

try the below code ,

$('.myinput').keypress(function(event){

        if(event.which != 8 && isNaN(String.fromCharCode(event.which))){
            event.preventDefault(); //stop character from entering input
        }
        var value = $(this).val();

        if (value > 200 && value < 500) { // check numbers between 200 and 500
            ..
        }

        $('.error').fadeIn(1000, function () {
            $(this).fadeOut(500)
        })

    });

Answer 3

使用number输入字段指定最小/最大。

 <input type="number" min="200" max="500" />