如何限制文本输入中的输入号码

Question

我有一个用于分页页面更改的文本输入。我需要限制打印的页码数f.e. 15（最大页数）。所以我试着用下面的代码，但是当数字高于15时，值总是变为15，并且实际输入数字。

actual.on('keypress', function() { 
    console.log('test'); 
    var t = $(this); 
    if (t.val() < 1) t.val('1'); 
    if (t.val() > 15) t.val('15'); 
}); 

小提琴：http://jsfiddle.net/v6fhobr7/

任何人可以帮助？

Answer 1

尝试将其从'keypress'更改为'keyup' ...有一个轻微的闪烁，但它的工作原理。

Answer 2

@ rfornal的解决方案工作好，但很难输入单一的数字值，除非你真的快：

http://jsfiddle.net/v6fhobr7/7/

所以最好改变值之前设置一个轻微的超时：

var actual = $('.actual'); 
var tm; 

actual.on('keyup', function() { 
    var t = $(this); 

    if (tm) clearTimeout(tm); 
    tm = setTimeout(function() { 
     if (t.val() < 1) t.val('1'); 
     if (t.val() > 15) t.val('15'); 
    }, 250); 
}); 

的jsfiddle演示：http://jsfiddle.net/v6fhobr7/10/

Answer 3

在jQuery 2.x中，您可以使用actual.on('input')，它可以在没有闪烁的情况下执行所需操作。

请注意，这将阻止用户完全清除输入;如果你想允许这个，那么你可能想要明确地处理t.val() == ''的情况。

actual.on('input', function(e) { 
    var t = $(this); 
    if (t.val() == '') return; 
    if (t.val() < 1) t.val('1'); 
    if (t.val() > 15) t.val('15'); 
}); 

http://jsfiddle.net/v6fhobr7/12/

编辑：

注意，这种解决方案并不限制输入只有数字字符（你仍然可以键入字母和符号）。如果你想防止这种情况发生，除了上面我的回答外，还可以使用this solution。或者，如果你不关心IE 9或移动浏览器，Mathletics的答案是最好的。

Answer 4

使用number字段。

<input type="number" min="1" max="15" step="1">