Question

我有一个文本框，我想使用关键事件将该值限制为最大值

我尝试使用以下代码并且工作正常

function validateRange(ele) {       
    if(ele.val() < 0 || ele.val() > 100){
        console.log('false');
    }else{
        console.log('true');
    }
}
$('.digit-validation').keyup(function(event){
    validateRange($(this));
});

HTML：

<form:input type="text" path="depth" cssClass="number inplace-textbox digit-validation" data-min="0" size="10" />

我希望if(ele.val() < 0 || ele.val() > 100)停止按键。

更新：我正在尝试进行各种值验证。

Answer 1

为什么不使用maxlength HTML属性？

<input type="text" maxlength="100" />

没有必要使用JS来实现这一目标。

Answer 2

我建议您尝试使用HTML input类型number，min和max属性：

<input type="number" min="0" max="100" />

JS Fiddle demo

这允许用户直接输入数字（使用键盘或复制/粘贴），并允许使用step属性（step="2"）控制增量，例如，允许每次点击微调箭头时，增量或减量为2。

但是，如果您必须使用非数字input：

Number.prototype.between  = function (a, b, inclusive) {
    var min = Math.min.apply(Math, [a,b]),
        max = Math.max.apply(Math, [a,b]);
    return inclusive ? this >= min && this <= max : this > min && this < max;
};

$('.digit-validation').keydown(function(event){
    var v = parseFloat(this.value + String.fromCharCode(event.which));
    return parseFloat(v).between(0,100,true);
});

JS Fiddle demo

Answer 3

要进行验证，您需要做两件事：

检查用户是否输入了数字
检查用户是否输入0到100之间的内容

对于第一个，因为您使用jQuery，您可以使用$.isNumeric()。对于第二个，由于parseInt()，您需要将值解析为整数。

那会给你：

http://jsfiddle.net/tLwYX/

function validateRange(ele) {    
    var val = ele.val();
    if(!$.isNumeric(val) || parseInt(val,10) < 0 || parseInt(val,10) > 100){
        $('#result').html('false');
    }else{
        $('#result').html('true');
    }
}
$('.digit-validation').keyup(function(event){
    validateRange($(this));
});

如何使用键事件的最大值限制文本框值？

3 个答案: