Javascript或jQuery接受小于100的数字的文本字段
[英]Javascript or jQuery to accept numbers less than 100 for text field
问题描述
In my project I have a text field where I need to accept values less than or equal to 100. In that text field how can I achieve this through javascript or jquery. 
在我的项目中，我有一个文本字段，我需要接受小于或等于100的值。在该文本字段中，如何通过javascript或jquery实现此目的。 Somehow I have managed to accept only numbers in text box but how can i restrict it not accept numbers greater than 100. 不知何故，我设法只在文本框中接受数字，但是如何限制它不接受大于100的数字。
Here is the code which I have tried to accept only numbers 这是我尝试仅接受数字的代码
function isNumber(evt) {
evt = (evt) ? evt : window.event;
var charCode = (evt.which) ? evt.which : evt.keyCode;
if (charCode > 31 && (charCode < 48 || charCode > 57)) {
return false;
}
return true;
}
8 个解决方案
解决方案1
7 已采纳 2014-04-04 11:51:47
First off, you can use number type in HTML5 with the max attribute set to 100. 首先，您可以在HTML5中使用number类型，并将max属性设置为100。
<input id="numberbox" type='number' max='100'>
This will allow your browser to detect when it's over 100 when submitted. 这样一来，您的浏览器便可以检测提交时的时间是否超过100 。 However, it won't work on older browsers and some smartphones. 但是，它不适用于旧版浏览器和某些智能手机。
Alternatively, you could do this: 或者，您可以这样做：
<input type='text' maxlength='2' pattern='^[0-9]$'>
But I feel this option is overkill. 但是我觉得这个选择太过分了。 But if you want to do it that way, that's up to you. 但是，如果您想那样做，则取决于您。
In jQuery, you can do this: 在jQuery中，您可以执行以下操作：
$('#numberbox').keyup(function(){ if ($(this).val() > 100){ alert("No numbers above 100"); $(this).val('100'); } });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <input type='text' id='numberbox'>
Please also validate back-end, someone with only just enough knowledge could easily bypass this. 也请验证后端，只有足够多的知识的人才能轻松绕过此操作。
解决方案2
2 2014-04-04 12:02:26
解决方案3
1 2014-04-04 11:51:22
With jquery you can to something like this : 使用jquery，您可以执行以下操作：
$('#my-field').blur(function() {
if(parseInt($(this).val()) < 100) {
$(this).val('');
}
});
The blur event is thrown when user leave the field (field loose the focus). 当用户离开视场（视场失去焦点）时，将引发模糊事件。 Then it chekcks if the value is less than 100 and empty it if necessary. 然后，如果该值小于100，则进行检查，并在必要时将其清空。
解决方案4
1 2014-04-04 11:52:23
function isNumber(evt) {
evt = (evt) ? evt : window.event;
var charCode = (evt.which) ? evt.which : evt.keyCode;
var str = String.fromCharCode(charCode);
if (str>100)) {
return false;
}
return true;
}
you can use fromCharCode it can return character 您可以使用fromCharCode它可以返回字符
解决方案5
1 2014-04-04 11:52:59
please use max length 请使用最大长度
maxlength="2"
EX. 例如
<!DOCTYPE html>
<html>
<body>
<form action="demo_form.asp">
PIN: <input type="text" name="pin" maxlength="2" size="30"><br>
<input type="submit" value="Submit">
</form>
</body>
</html>
解决方案6
1 2014-04-04 11:53:10
You can do this: 你可以这样做：
$('yourElem').on('keydown', function(e){
if(this.value > 100){
alert('You have entered more than 100 as input');
return false;
}
});
maxlength attribute can restrict the numbers more than 3 digits, so you can use this to restrict: maxlength属性可以将数字限制为超过3位，因此您可以使用此限制：
maxlength="3"
yet you need to do js validation as suggested above because user with maxlength still can enter more than 100 as asked. 但您需要按照上述建议进行js验证，因为maxlength用户仍然可以按要求输入100多个。
解决方案7
1 2014-04-04 11:53:27
Try this: 尝试这个：
<script type="text/javascript">
function fnc(value, min, max)
{
if(parseInt(value) < 0 || isNaN(value))
return 0;
else if(parseInt(value) > 100)
return "Number is greater than 100";
else return value;
}
</script>
<input type="text" name="textWeight" id="txtWeight" maxlength="5" onkeyup="this.value = fnc(this.value, 0, 100)"/>
解决方案8
1 2014-04-04 11:56:48
along with your code you can add one more line to restrict text-field to accept less than 2 char.... 连同您的代码，您可以再添加一行以限制文本字段接受少于2个字符。
if (charCode.length > 2) {
return false;
}
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.