在Html Textarea中设置maxlength
我怎样才能在textarea设置maxlength ？ 为什么maxlength在textarea不能正常工作？
在HTML5之前，我们有一个简单但可行的方法：首先在textarea元素中设置一个maxlength属性：
<textarea maxlength='250' name=''></textarea>
然后使用JavaScript来限制用户input：
$(function() { $("textarea[maxlength]").bind('input propertychange', function() { var maxLength = $(this).attr('maxlength'); if ($(this).val().length > maxLength) { $(this).val($(this).val().substring(0, maxLength)); } }) });
确保绑定“ input ”和“ propertychange ”事件，使其在各种浏览器如Firefox / Safari和IE中工作。
如果您使用HTML 5，则需要在您的DOCTYPE声明中指定。
对于有效的HTML 5文档，它应该从以下开始：
<!DOCTYPE html>
在HTML 5之前， textarea元素没有maxlength属性。
你可以在DTD / spec中看到这个：
<!ELEMENT TEXTAREA - - (#PCDATA) -- multi-line text field --> <!ATTLIST TEXTAREA %attrs; -- %coreattrs, %i18n, %events -- name CDATA #IMPLIED rows NUMBER #REQUIRED cols NUMBER #REQUIRED disabled (disabled) #IMPLIED -- unavailable in this context -- readonly (readonly) #IMPLIED tabindex NUMBER #IMPLIED -- position in tabbing order -- accesskey %Character; #IMPLIED -- accessibility key character -- onfocus %Script; #IMPLIED -- the element got the focus -- onblur %Script; #IMPLIED -- the element lost the focus -- onselect %Script; #IMPLIED -- some text was selected -- onchange %Script; #IMPLIED -- the element value was changed -- %reserved; -- reserved for possible future use -- >
为了限制input到textarea的字符数量，你需要在onChange事件中使用javascript。 然后，您可以计算字符的数量，并禁止进一步input。
以下是对文本input以及如何使用服务器和客户端脚本来限制大小的深入讨论。
这是另一个样本。
在html4中为textarea做maxlength的简单方法是：
<textarea cols="60" rows="5" onkeypress="if (this.value.length > 100) { return false; }"></textarea>
将“100”更改为任意数量的字符
正如我在对aqingsao的回答中所说的，当textarea有换行符时，至less在Windows上是不行的。
我已经稍微改变了他的答案：
$(function() { $("textarea[maxlength]").bind('input propertychange', function() { var maxLength = $(this).attr('maxlength'); //I'm guessing JavaScript is treating a newline as one character rather than two so when I try to insert a "max length" string into the database I get an error. //Detect how many newlines are in the textarea, then be sure to count them twice as part of the length of the input. var newlines = ($(this).val().match(/\n/g) || []).length if ($(this).val().length + newlines > maxLength) { $(this).val($(this).val().substring(0, maxLength - newlines)); } }) });
现在，当我尝试用换行符粘贴大量数据时，我得到的字符数量恰到好处。
$(function(){ $("#id").keypress(function() { var maxlen = 100; if ($(this).val().length > maxlen) { return false; } }) });
在HTML5之前，只能通过JavaScript或服务器端validation来检查（更好，因为JavaScript显然只能在启用JavaScript的情况下运行…）。 textareas没有本地最大长度属性。
由于HTML5是一个有效的属性，所以将doctype定义为HTML5可能会有帮助。 不过，我不知道所有浏览器是否支持这个属性，
<!DOCTYPE html>
调整：无; 这个属性修复你的文本区域并绑定它。 你使用这个CSS属性id你的textarea.gave文本区域的ID和代表该ID可以使用此CSS属性。
尝试这个
$(function(){ $("textarea[maxlength]") .keydown(function(event){ return !$(this).attr("maxlength") || this.value.length < $(this).attr("maxlength") || event.keyCode == 8 || event.keyCode == 46; }) .keyup(function(event){ var limit = $(this).attr("maxlength"); if (!limit) return; if (this.value.length <= limit) return true; else { this.value = this.value.substr(0,limit); return false; } }); });
对于我来说，作品非常完美，没有跳跃/显示其他angular色 工作完全像input上的最大长度
<p> <textarea id="msgc" onkeyup="cnt(event)" rows="1" cols="1"></textarea> </p> <p id="valmess2" style="color:red" ></p> function cnt(event) { document.getElementById("valmess2").innerHTML=""; // init and clear if b < max allowed character a = document.getElementById("msgc").value; b = a.length; if (b > 400) { document.getElementById("valmess2").innerHTML="the max length of 400 characters is reached, you typed in " + b + "characters"; } }
maxlength只对HTML5有效。 对于HTML / XHTML，您必须使用JavaScript和/或PHP。 用PHP你可以使用strlen作为例子。这个例子只显示最大长度，它不会阻塞input。
