在HTML中，文本框（TextBox）具有maxlength属性，可以限制允许输入的字符数。然而，文本域（TextArea）并没有内置的属性来控制字符数。为了实现这一功能，可以使用简单的JavaScript代码来控制文本域的输入长度。
将编写两个函数处理按键和粘贴事件。
function maxLength(field, maxChars) {
if (field.value.length >= maxChars) {
event.returnValue = false;
return false;
}
}
function maxLengthPaste(field, maxChars) {
event.returnValue = false;
if ((field.value.length + window.clipboardData.getData("Text").length) > maxChars) {
return false;
}
event.returnValue = true;
}
maxLength() 函数用于处理按键事件，而 maxLengthPaste() 函数用于处理粘贴事件。将以下代码添加到HTML中或生成此代码：
<textarea rows="5" cols="6" onKeyPress='return maxLength(this, "30");' onpaste='return maxLengthPaste(this, "30");'></textarea>
这样，文本域将不允许输入超过30个字符，同时也不允许粘贴超过30个字符。
如果希望在用户输入超过限制时提醒用户，请在返回false语句之前插入一个alert消息。
function maxLength(field, maxChars) {
if (field.value.length >= maxChars) {
event.returnValue = false;
alert("超过 " + maxChars + " 个字符");
return false;
}
}
function maxLengthPaste(field, maxChars) {
event.returnValue = false;
if ((field.value.length + window.clipboardData.getData("Text").length) > maxChars) {
alert("超过 " + maxChars + " 个字符");
return false;
}
event.returnValue = true;
}
如果不想将字段作为参数传递给函数，可以从事件对象中获取它。
var field = event != null ? event.srcElement : e.target;
可以引用另一篇文章《更改当前焦点元素的背景颜色》来分配全局事件处理程序。在这种情况下，不需要将maxLength作为参数传递，而是将其作为属性，以便可以为文本域注册全局处理程序，并使用字段的maxLength属性来验证长度。
<script language="javascript">
function attachEvent(name, elementName, callBack) {
var element = elementName;
if (typeof elementName == 'string')
element = document.getElementById(elementName);
if (element.addEventListener) {
element.addEventListener(name, callBack, false);
} else if (element.attachEvent) {
element.attachEvent('on' + name, callBack);
}
}
function maxLength() {
var field = event != null ? event.srcElement : e.target;
if (field.maxChars != null) {
if (field.value.length >= parseInt(field.maxChars)) {
event.returnValue = false;
alert("超过 " + field.maxChars + " 个字符");
return false;
}
}
}
function maxLengthPaste() {
event.returnValue = false;
var field = event != null ? event.srcElement : e.target;
if (field.maxChars != null) {
if ((field.value.length + window.clipboardData.getData("Text").length) > parseInt(field.maxChars)) {
alert("超过 " + field.maxChars + " 个字符");
return false;
}
}
event.returnValue = true;
}
</script>
生成或创建此HTML：
<textarea rows="5" cols="6" maxLength="30" id="textarea1"></textarea>
<script language="javascript">
attachEvent("keypress", "textarea1", maxLength);
attachEvent("paste", "textarea1", maxLengthPaste);
</script>
或者可以分配全局处理程序：
<script language="javascript">
function setTextAreaListner(eve, func) {
var ele = document.forms[0].elements;
for (var i = 0; i < ele.length; i++) {
element = ele[i];
if (element.type) {
switch (element.type) {
case 'textarea':
attachEvent(eve, element, func);
}
}
}
}
</script>
<script language="javascript">
setTextAreaListner("keypress", maxLength);
setTextAreaListner("paste", maxLengthPaste);
</script>