使用 JavaScript 对 HTML 中的文本区域施加最大长度的综合指南

在 Web 开发中，通常需要控制输入文本的最大长度地区。此方案要求您自动在多个文本区域上强制执行 maxlength 属性。虽然以前的解决方案涉及对每个文本区域进行手动事件处理，但我们将探索一种替代方法，消除重复代码的需要。

解决方案：

此解决方案的关键在于 JavaScript 的能力扫描页面中的所有文本区域并动态地将事件侦听器添加到适当的区域。通过利用 onload 事件，我们可以在加载时访问整个页面的内容，包括任何文本区域。

window.onload = function() {

现在，我们可以遍历文档，搜索带有 TEXTAREA 标签的所有元素：

var txts = document.getElementsByTagName('TEXTAREA');

接下来，我们迭代每个文本区域以检查它是否具有有效的 maxlength 属性。请注意，我们使用正则表达式来确保 maxlength 值为数字。

for(var i = 0, l = txts.length; i 
对于每个符合条件的文本区域，我们定义一个回调函数来验证最大长度。该函数将：
以整数形式检索 maxlength 属性的值
检查文本区域值的当前长度是否超过 maxlength
如果超过，显示警告消息并将值截断为允许的最大长度
var func = function() {
    var len = parseInt(this.getAttribute("maxlength"), 10);

    if(this.value.length > len) {
        alert('Maximum length exceeded: '   len);
        this.value = this.value.substr(0, len);
        return false;
    }
}
最后，我们将此回调函数附加到文本区域的 keyup 和 Blur 事件。
txts[i].onkeyup = func;
txts[i].onblur = func;
这种综合方法提供了一种无缝解决方案，可以自动在网页上的所有合格文本区域上施加最大长度，而无需重复的事件处理。