Html 限制表单输入文本字段中允许的字符数
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/8545376/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Limit number of characters allowed in form input text field
提问by BruceyBandit
How do I limit or restrict the user to only enter a maximum of five characters in the textbox?
如何限制或限制用户在文本框中最多只能输入五个字符？
Below is the input field as part of my form:
以下是作为表单一部分的输入字段：
<input type="text" id="sessionNo" name="sessionNum" />
Is it using something like maxSize or something like that?
它使用的是像 maxSize 之类的东西吗？
回答by Jared Farrish
最大长度：
The maximum number of characters that will be accepted as input. This can be greater that specified by SIZE , in which case the field will scroll appropriately. The default is unlimited.
将被接受为输入的最大字符数。这可以大于 SIZE 指定的值，在这种情况下，该字段将适当滚动。默认为无限制。
<input type="text" maxlength="2" id="sessionNo" name="sessionNum" onkeypress="return isNumberKey(event)" />
However, this may or may not be affected by your handler. You may need to use or add another handler function to test for length, as well.
但是，这可能会或可能不会受到您的处理程序的影响。您可能还需要使用或添加另一个处理程序函数来测试长度。
回答by Nonym
The simplest way to do so:
最简单的方法：
maxlength="5"
So.. Adding this attribute to your control:
所以.. 将此属性添加到您的控件中：
<input type="text"
id="sessionNo"
name="sessionNum"
onkeypress="return isNumberKey(event)"
maxlength="5" />
回答by b3verelabs
Add the following to the header:
将以下内容添加到标题中：
<script language="javascript" type="text/javascript">
function limitText(limitField, limitNum) {
if (limitField.value.length > limitNum) {
limitField.value = limitField.value.substring(0, limitNum);
}
}
</script>
<input type="text" id="sessionNo" name="sessionNum" onKeyDown="limitText(this,5);"
onKeyUp="limitText(this,5);"" />
回答by Mahdi Jazini
According to w3c, the default value for the MAXLENGTH attribute is an unlimited number. So if you don't specify the max a user could cut and paste the bible a couple of times and stick it in your form.
根据w3c，MAXLENGTH 属性的默认值是一个无限的数字。因此，如果您不指定最大值，则用户可以多次剪切和粘贴圣经并将其粘贴在您的表单中。
Even if you do specify the MAXLENGTH to a reasonable number make sure you double check the length of the submitted data on the server before processing (using something like php or asp) as it's quite easy to get around the basic MAXLENGTH restriction anyway
即使您确实将 MAXLENGTH 指定为一个合理的数字，请确保在处理之前仔细检查服务器上提交的数据的长度（使用 php 或 asp 之类的东西），因为无论如何都很容易绕过基本的 MAXLENGTH 限制
回答by user5829707
Make it simpler
让它更简单
<input type="text" maxlength="3" />
and use an alert to show that max chars have been used.
并使用警报显示已使用最大字符数。
回答by anonymous
<input type="text" maxlength="5">
the maximum amount of letters that can be in the input is 5.
输入中可以包含的最大字母数为 5。
回答by Sa?o Krajnc
I alway do it like this:
我总是这样做：
$(document).ready(function(){
var maxChars = $("#sessionNum");
var max_length = maxChars.attr('maxlength');
if (max_length > 0) {
maxChars.bind('keyup', function(e){
length = new Number(maxChars.val().length);
counter = max_length-length;
$("#sessionNum_counter").text(counter);
});
}
});
Input:
输入：
<input name="sessionNum" id="sessionNum" maxlength="5" type="text">
Number of chars: <span id="sessionNum_counter">5</span>
回答by Kondal
Maxlength
最长长度
The maximum number of characters that will be accepted as input. The maxlength attribute specifies the maximum number of characters allowed in the element.
将被接受为输入的最大字符数。maxlength 属性指定元素中允许的最大字符数。
<form action="/action_page.php">
Username: <input type="text" name="usrname" maxlength="5"><br>
<input type="submit" value="Submit">
</form>
回答by P.Banerjee
<input type="number" id="xxx" name="xxx" oninput="maxLengthCheck(this)" maxlength="10">
function maxLengthCheck(object) {
if (object.value.length > object.maxLength)
object.value = object.value.slice(0, object.maxLength)
}
回答by BKas Development
You can use
<input type = "text" maxlength="9">or
您可以使用
<input type = "text" maxlength="9">或
<input type = "number" maxlength="9">for numbers
or
<input type = "email" maxlength="9">for email
validation will show up
<input type = "number" maxlength="9"><input type = "email" maxlength="9">将显示数字或
电子邮件验证
