Question

如何限制可以输入HTML <textarea>的最大字符数？我正在寻找跨浏览器的解决方案。

Answer 1

TEXTAREA标记没有MAXLENGTH属性的方式 INPUT标记，至少在大多数标准浏览器中都没有。将键入的字符数限制为TEXTAREA标记的一种非常简单有效的方法是：

<textarea onKeyPress="return ( this.value.length < 50 );"></textarea>

注意： onKeyPress，将阻止按任何按钮，任何按钮 包括退格键。

这是有效的，因为布尔表达式比较了字段的长度在将新字符添加到您想要的最大长度之前（在此示例中为50，在此使用您自己的长度），如果还有一个空间，则返回true，否则返回false。从大多数事件返回false会取消默认操作。因此，如果当前长度已经是50（或更多），则处理程序返回false， <{1}}操作已取消，且未添加该字符。

美中不足的是，有可能粘贴到KeyPress，这不会导致TEXTAREA事件触发，从而绕过此检查。 Internet Explorer 5+包含一个KeyPress事件，其处理程序可以包含校验。但是，请注意，您还必须考虑多少字符在剪贴板中等待，知道总数是否会发生带你超过极限。幸运的是，IE还包含一个剪贴板来自窗口对象的对象。1因此：

onPaste

同样，<textarea onKeyPress="return ( this.value.length < 50 );" onPaste="return (( this.value.length + window.clipboardData.getData('Text').length) < 50 );"></textarea>事件和onPaste对象仅为IE 5+。对于跨浏览器解决方案，您只需使用clipboardData或OnChange处理程序来检查长度，并根据需要处理它（静默截断值，通知用户等）。不幸的是，只有当用户试图离开该领域时，这并没有发现错误，这种情况并不友好。

Source

此外，还有另一种方法，包括您可以在页面中添加的已完成脚本：

http://cf-bill.blogspot.com/2005/05/textarea-maxlength-revisited.html

Answer 2

HTML5现在允许maxlength attribute on <textarea>。

除了IE＆lt; = 9和iOS Safari 8.4之外，所有浏览器都支持它。请参阅support table on caniuse.com。

Answer 3

$(function(){  
  $("#id").keypress(function() {  
    var maxlen = 100;
if ($(this).val().length > maxlen) {  
  return false;
}  
})
});

参考Set maxlength in Html Textarea

HTML <textarea> </textarea>的最大长度

3 个答案: