blocks|key|3988996|text|如果您正在使用HTML5，则需要在DOCTYPE声明中指定它。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|3988997|对于有效的HTML+5文档，它应该以：|3988998|<!DOCTYPE+html>|code-block|syntax|javascript|3988999|3989000|在HTML5之前，textarea元素没有maxlength属性。|3989001|可以在DTD/spec中看到这一点|3989002|<!ELEMENT+TEXTAREA+-+-+(#PCDATA)+++++++--+multi-line+text+field+-->
<!ATTLIST+TEXTAREA
++%25attrs;++++++++++++++++++++++++++++++--+%25coreattrs,+%25i18n,+%25events+--
++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+++%25Character;++++#IMPLIED++--+accessibility+key+character+--
++onfocus+++++%25Script;+++++++#IMPLIED++--+the+element+got+the+focus+--
++onblur++++++%25Script;+++++++#IMPLIED++--+the+element+lost+the+focus+--
++onselect++++%25Script;+++++++#IMPLIED++--+some+text+was+selected+--
++onchange++++%25Script;+++++++#IMPLIED++--+the+element+value+was+changed+--
++%25reserved;+++++++++++++++++++++++++++--+reserved+for+possible+future+use+--
++>|3989003|为了限制输入textarea的字符数，您需要在onChange事件中使用javascript。然后，您可以计算字符数，并禁止进一步键入。|3989004|Here深入讨论了文本输入以及如何使用服务器和客户端脚本来限制大小。|3989005|Here是另一个例子。|3989006|entityMap|0|LINK|mutability|MUTABLE|url|http://www.w3.org/TR/html5-diff/#doctype|1|http://www.w3schools.com/tags/tag_textarea.asp|2|http://www.w3.org/TR/html4/sgml/dtd.html|3|http://www.cs.tut.fi/~jkorpela/forms/textarea.html|4|http://www.mediacollege.com/internet/javascript/form/limit-characters.html^0|H|7|H|7|0|0|0|0|0|9|8|L|9|9|8|1|0|3|8|2|0|0|6|8|N|8|0|0|4|3|0|0|4|4|0^^$0|@$1|2|3|4|5|6|7|1F|8|@$9|1G|A|1H|B|C]]|D|@$9|1I|A|1J|1|1K]]|E|$]]|$1|F|3|G|5|6|7|1L|8|@]|D|@]|E|$]]|$1|H|3|I|5|J|7|1M|8|@]|D|@]|E|$K|L]]|$1|M|3|-4|5|6|7|1N|8|@]|D|@]|E|$]]|$1|N|3|O|5|6|7|1O|8|@$9|1P|A|1Q|B|C]|$9|1R|A|1S|B|C]]|D|@$9|1T|A|1U|1|1V]]|E|$]]|$1|P|3|Q|5|6|7|1W|8|@]|D|@$9|1X|A|1Y|1|1Z]]|E|$]]|$1|R|3|S|5|J|7|20|8|@]|D|@]|E|$K|L]]|$1|T|3|U|5|6|7|21|8|@$9|22|A|23|B|C]|$9|24|A|25|B|C]]|D|@]|E|$]]|$1|V|3|W|5|6|7|26|8|@]|D|@$9|27|A|28|1|29]]|E|$]]|$1|X|3|Y|5|6|7|2A|8|@]|D|@$9|2B|A|2C|1|2D]]|E|$]]|$1|Z|3|-4|5|6|7|2E|8|@]|D|@]|E|$]]]|10|$11|$5|12|13|14|E|$15|16]]|17|$5|12|13|14|E|$15|18]]|19|$5|12|13|14|E|$15|1A]]|1B|$5|12|13|14|E|$15|1C]]|1D|$5|12|13|14|E|$15|1E]]]]

If you are using HTML 5, you need to specify that in your <a href="http://www.w3.org/TR/html5-diff/#doctype" rel="noreferrer"><code>DOCTYPE</code></a> declaration.

For a valid HTML 5 document, it should start with:

<pre><code>&lt;!DOCTYPE html&gt;
</code></pre>

<hr>

Before HTML 5, the <a href="http://www.w3schools.com/tags/tag_textarea.asp" rel="noreferrer"><code>textarea</code></a> element did not have a <code>maxlength</code> attribute.

You can see this in the <a href="http://www.w3.org/TR/html4/sgml/dtd.html" rel="noreferrer">DTD/spec</a>:

<pre><code>&lt;!ELEMENT TEXTAREA - - (#PCDATA) -- multi-line text field --&gt;
&lt;!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 --
 &gt;
</code></pre>

In order to limit the number of characters typed into a <code>textarea</code>, you will need to use javascript with the <code>onChange</code> event. You can then count the number of characters and disallow further typing.

<a href="http://www.cs.tut.fi/~jkorpela/forms/textarea.html" rel="noreferrer">Here</a> is an in-depth discussion on text input and how to use server and client side scripting to limit the size.

<a href="http://www.mediacollege.com/internet/javascript/form/limit-characters.html" rel="noreferrer">Here</a> is another sample.

blocks|key|1511632|text|在HTML5之前，只能通过JavaScript或服务器端验证来检查这一点(更好，因为JavaScript显然只能在启用JavaScript的情况下工作...)。textareas没有原生的max-length属性。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1511633|因为HTML5是一个有效的属性，所以将您的文档类型定义为HTML5可能会有所帮助。我不知道是否所有的浏览器都支持这个属性：|1511634|<!DOCTYPE+html>|code-block|syntax|javascript|1511635|entityMap^0|0|0|0^^$0|@$1|2|3|4|5|6|7|K|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|L|8|@]|9|@]|A|$]]|$1|D|3|E|5|F|7|M|8|@]|9|@]|A|$G|H]]|$1|I|3|-4|5|6|7|N|8|@]|9|@]|A|$]]]|J|$]]

Before HTML5 it's only possible to check this with JavaScript or by a server-side verification (better, because JavaScript obviously only works with JavaScript enabled...). There is no native max-length attribute for textareas.

Since HTML5 it's a valid attribut, so defining your doctype as HTML5 may help. I don't know if all browsers support this attribute, though:

<pre><code>&lt;!DOCTYPE html&gt;
</code></pre>

blocks|key|2393260|text|在html4中为文本区域设置最大长度的简单方法是：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|2393261|<textarea+cols="60"+rows="5"+onkeypress="if+(this.value.length+>+100)+{+return+false;+}"></textarea>|code-block|syntax|javascript|2393262|将"100“更改为您想要的字符数|2393263|entityMap^0|0|0|0^^$0|@$1|2|3|4|5|6|7|K|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|L|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|M|8|@]|9|@]|A|$]]|$1|I|3|-4|5|6|7|N|8|@]|9|@]|A|$]]]|J|$]]

simple way to do maxlength for textarea in html4 is:

<pre><code>&lt;textarea cols="60" rows="5" onkeypress="if (this.value.length &gt; 100) { return false; }"&gt;&lt;/textarea&gt;
</code></pre>

Change the "100" to however many characters you want

blocks|key|325023|text|在HTML5之前，我们有一个简单但可行的方法:首先在the+_+set元素中设置一个way_+maxlength属性：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|325024|<textarea+maxlength='250'+name=''></textarea>++|code-block|syntax|javascript|325025|然后使用JavaScript限制用户输入：|325026|$(function()+{++
++++$("textarea[maxlength]").bind('input+propertychange',+function()+{++
++++++++var+maxLength+=+$(this).attr('maxlength');++
++++++++if+($(this).val().length+>+maxLength)+{++
++++++++++++$(this).val($(this).val().substring(0,+maxLength));++
++++++++}++
++++})++
});|325027|确保绑定"input“和"propertychange”事件，使其在各种浏览器上工作，如Firefox/Safari和IE。|offset|length|style|BOLD|325028|entityMap^0|0|0|0|0|5|5|D|E|0^^$0|@$1|2|3|4|5|6|7|S|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|T|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|U|8|@]|9|@]|A|$]]|$1|I|3|J|5|D|7|V|8|@]|9|@]|A|$E|F]]|$1|K|3|L|5|6|7|W|8|@$M|X|N|Y|O|P]|$M|Z|N|10|O|P]]|9|@]|A|$]]|$1|Q|3|-4|5|6|7|11|8|@]|9|@]|A|$]]]|R|$]]

Before HTML5, we have an easy but workable way:
Firstly set an maxlength attribute in the textarea element:

<pre><code>&lt;textarea maxlength='250' name=''&gt;&lt;/textarea&gt; 
</code></pre>

Then use JavaScript to limit user input:

<pre><code>$(function() { 
 $("textarea[maxlength]").bind('input propertychange', function() { 
 var maxLength = $(this).attr('maxlength'); 
 if ($(this).val().length &gt; maxLength) { 
 $(this).val($(this).val().substring(0, maxLength)); 
 } 
 }) 
});
</code></pre>

Make sure the bind both "input" and "propertychange" events to make it work on various browsers such as Firefox/Safari and IE.

blocks|key|1514339|text|正如我在对阿青操回答的评论中所说的那样，当textarea有换行符时，它就不太起作用了，至少在Windows上是这样。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|1514340|我稍微修改了一下他的回答：|1514341|$(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)+%7C%7C+[]).length
++++++++if+($(this).val().length+%2B+newlines+>+maxLength)+{
++++++++++++$(this).val($(this).val().substring(0,+maxLength+-+newlines));
++++++++}
++++})
});|code-block|syntax|javascript|1514342|现在，当我尝试用换行符粘贴大量数据时，我得到了正确的字符数。|1514343|entityMap^0|L|8|0|0|0|0^^$0|@$1|2|3|4|5|6|7|Q|8|@$9|R|A|S|B|C]]|D|@]|E|$]]|$1|F|3|G|5|6|7|T|8|@]|D|@]|E|$]]|$1|H|3|I|5|J|7|U|8|@]|D|@]|E|$K|L]]|$1|M|3|N|5|6|7|V|8|@]|D|@]|E|$]]|$1|O|3|-4|5|6|7|W|8|@]|D|@]|E|$]]]|P|$]]

As I said in a comment to aqingsao's answer, it doesn't quite work when the <code>textarea</code> has newline characters, at least on Windows.

I've change his answer slightly thus:

<pre><code>$(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 &gt; maxLength) {
 $(this).val($(this).val().substring(0, maxLength - newlines));
 }
 })
});
</code></pre>

Now when I try to paste a lot of data in with newlines, I get exactly the right number of characters.

blocks|key|3989186|text|调整大小:无；此属性固定文本区域并将其绑定。您可以使用此css属性id您的textarea.gave文本区域id，并且可以代表该id使用此css属性。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|3989187|entityMap^0|0^^$0|@$1|2|3|4|5|6|7|D|8|@]|9|@]|A|$]]|$1|B|3|-4|5|6|7|E|8|@]|9|@]|A|$]]]|C|$]]

resize:none;
This property fix your text area and bound it.
you use this css property id your textarea.gave text area an id and on the behalf of that id you can use this css property.

blocks|key|3989220|text|尝尝这个|type|unstyled|depth|inlineStyleRanges|entityRanges|data|3989221|$(function(){
++$("textarea[maxlength]")
++++.keydown(function(event){
+++++++return+!$(this).attr("maxlength")+%7C%7C+this.value.length+<+$(this).attr("maxlength")+%7C%7C+event.keyCode+==+8+%7C%7C+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;
++++++}++++
++++});
});|code-block|syntax|javascript|3989222|对我来说，作品非常完美，没有跳转/显示额外的字符；作品完全像输入的最大长度|3989223|entityMap^0|0|0|0^^$0|@$1|2|3|4|5|6|7|K|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|L|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|M|8|@]|9|@]|A|$]]|$1|I|3|-4|5|6|7|N|8|@]|9|@]|A|$]]]|J|$]]

try this

<pre><code>$(function(){
 $("textarea[maxlength]")
 .keydown(function(event){
 return !$(this).attr("maxlength") || this.value.length &lt; $(this).attr("maxlength") || event.keyCode == 8 || event.keyCode == 46;
 })
 .keyup(function(event){
 var limit = $(this).attr("maxlength");

 if (!limit) return;

 if (this.value.length &lt;= limit) return true;
 else {
 this.value = this.value.substr(0,limit);
 return false;
 } 
 });
});
</code></pre>

For me works really perfect without jumping/showing additional characters; works exactly like maxlength on input

blocks|key|2393389|text|$(function(){++
++$("#id").keypress(function()+{++
++++var+maxlen+=+100;
++++if+($(this).val().length+>+maxlen)+{++
++++++return+false;
++++}++
++})
});++|type|code-block|depth|inlineStyleRanges|entityRanges|data|syntax|javascript|2393390|unstyled|entityMap^0|0^^$0|@$1|2|3|4|5|6|7|G|8|@]|9|@]|A|$B|C]]|$1|D|3|-4|5|E|7|H|8|@]|9|@]|A|$]]]|F|$]]

<pre><code>$(function(){ 
 $("#id").keypress(function() { 
 var maxlen = 100;
 if ($(this).val().length &gt; maxlen) { 
 return false;
 } 
 })
}); 
</code></pre>

blocks|key|1511753|text|
+++<textarea+id="msgc"+onkeyup="cnt(event)"+rows="1"+cols="1"></textarea>+
+
<p+id="valmess2"+style="color:red"+>

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++"+%2B+b+%2B+"characters";+
++}+
}|type|code-block|depth|inlineStyleRanges|entityRanges|data|syntax|javascript|1511754|maxlength仅对HTML5有效。对于HTML/XHTML，你必须使用JavaScript和/或PHP。在PHP中，你可以使用strlen表示example.This的最大长度，它不会阻塞输入。|unstyled|1511755|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$B|C]]|$1|D|3|E|5|F|7|J|8|@]|9|@]|A|$]]|$1|G|3|-4|5|F|7|K|8|@]|9|@]|A|$]]]|H|$]]

<pre><code>&lt;p&gt;
 &lt;textarea id="msgc" onkeyup="cnt(event)" rows="1" cols="1"&gt;&lt;/textarea&gt; 
&lt;/p&gt; 
&lt;p id="valmess2" style="color:red" &gt;&lt;/p&gt;

function cnt(event)
{ 
 document.getElementById("valmess2").innerHTML=""; // init and clear if b &lt; max 
allowed character 

 a = document.getElementById("msgc").value; 
 b = a.length; 
 if (b &gt; 400)
 { 
 document.getElementById("valmess2").innerHTML="the max length of 400 characters is 
reached, you typed in " + b + "characters"; 
 } 
}
</code></pre>

maxlength is only valid for HTML5. For HTML/XHTML you have to use JavaScript and/or PHP. With PHP you can use strlen for example.This example indicates only the max length, it's NOT blocking the input.

How can I set the <code>maxlength</code> in a <code>textarea</code>? And why <code>maxlength</code> is not working properly in <code>textarea</code>?

Set maxlength in Html Textarea

翻译质量差，导致语言生硬或混乱。

没有提供实际的解决方法或示例。

解答不清晰，无法理解或解决问题。

页面排版不美观，阅读体验差。

文章

问答

视频

学习中心

腾讯云实验室

直播

竞赛

腾讯云代码分析专区

腾讯iOA零信任安全管理系统专区

腾讯云架构师技术同盟交流圈

腾讯云数据库专区

腾讯云顾问专区

腾讯云原生专区

腾讯混元专区

腾讯云TCE专区

腾讯云Lighthouse专区

腾讯云HAI专区

腾讯云Edgeone专区

腾讯云存储专区

腾讯云智能专区

腾讯轻联专区 

腾讯云开发专区

TAPD专区

腾讯轻量云游戏服专区

腾讯云最具价值专家

腾讯云架构师技术同盟

腾讯云创作之星

腾讯云开发者先锋

腾讯云代码助手

云原生构建

TAPD 敏捷项目管理

Cloud Studio

SDK中心

API中心

命令行工具

涵盖代码开发、场景应用、自动测试全流程，助你从零构建专属AI助手

一站式MCP教程库，解锁AI应用新玩法

如何在textarea中设置maxlength？为什么maxlength在textarea中不能正常工作

问在Html Textarea中设置最大长度
EN

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问在Html Textarea中设置最大长度EN