今天突然遇到一个小问题，说实话，貌似再小的问题，只要小码哥起初没有头绪，那就一定会卡壳。不要笑我！！

下面说说今天遇到的问题：即textarea文本域标签如何限定其内输入的文本字数？

晕了，有人说了，NM不会百度啊，，，，，没错，本文就是我百度出来的，看着还挺详细，就转来了。哈哈！

其实说到文本字数，我们都知道说的是textarea的value值。可怎么完美的解决。还有待验证！

通常的做法就是使用#脚本语言来实现对textarea文本域的字数输入限制，简单而实用。假设我们有一个id为 txta1 的textarea文本区，我们可以通过以下代码限制它的键盘输入字数为10个字（汉字或其他小角字符）：

＜script language="#" type="text/ecmascript"＞ 
window.onload = function() 
{ 
document.getElementById('txta1').onkeydown = function() 
{    
    if(this.value.length >= 10) 
      event.returnValue = false; 
} 
} 
＜/script＞ 
它的原理是通过对keydown（键盘键位按下）事件对指定id号的文本区进行监测，可以想象，它只能限制键盘输入，如果用户通过鼠标右键粘贴剪切板中的文本，它无法控制字数。

 

通过键盘输入，以上文本区只能输入10个字。但是，我们的目的并没有达到！请随便复制一些文本，试着用鼠标右键粘贴，看看发生了什么。

你可以在网上找到类似上述的其他JS脚本，它们不管多么优秀，其原理都是一样的，通过对keydown、keyup或keypress之类的键盘键位操作事件来监控文本区的输入，无法防止鼠标右键的粘贴，为此，如果一定要真正地限制textarea的字数，我们还得为网页加另一把锁——禁用鼠标右键，这无疑得付出额外的开销，同时也可能是网页制作者不一定愿意做的。其实，还有一个更简单的方法，使用onpropertychange属性。

onpropertychange可以用来判断预定元素的value值，当元素的value值发生变化时判断事件就会被触发，仅关心被监测元素的value值，避开了输入的来源，从而可以比较理想地达成我们的限制字数这一目的。它属于JS范畴，可以在表单方框区代表中嵌套使用，以下是代码和效果样式，可以像上面那样测试输入，你会发现它真正达到目的：不管用什么方式输入，它只能输入100个字（汉字或其他小解符号）：

代码：

<textarea onpropertychange="if(value.length>100) value=value.substr(0,100)" class="smallArea" cols="60" name="txta" rows="8"></textarea>


当然，为了更为保险，处理表单数据的后台脚本程序还应该对提交来的数据进行再一次的检测，如果字数超出预设的数量则进行相应处理，这样才达到真正限制字数的目的。（完）

 

 

另外一种方法实现textarea限制输入字数（包含中文只能输入10个，全ASCII码能够输入20个）

<script> 
function check() { 
var regC = /[^ -~]+/g; 
var regE = /\D+/g; 
var str = t1.value; 

if (regC.test(str)){ 
    t1.value = t1.value.substr(0,10); 
} 

if(regE.test(str)){ 
    t1.value = t1.value.substr(0,20); 
} 
} 
</script> 
<textarea maxlength="10" id="t1" οnkeyup="check();"> 
</textarea>

 

 

 

还有一种方式：

function textCounter(field, maxlimit) { 
if (field.value.length > maxlimit){ 
field.value = field.value.substring(0, maxlimit); 
}else{ 
document.upbook.remLen.value = maxlimit - field.value.length; 
} 
} 

<textarea name=words cols=19 rows=5 class=input1 onPropertyChange= "textCounter(upbook.words, 50) "> textarea> 
剩余字数: <input name=remLen type=text id= "remLen " style= "background-color: #D4D0C8; border: 0; color: red " value=50 size=3 maxlength=3 readonly>

 

 

function LimitTextArea(field){ 
    maxlimit=200; 
    if (field.value.length > maxlimit) 
     field.value = field.value.substring(0, maxlimit); 
       
   }

<textarea cols=50 rows=10 name="comment" id="commentarea" onKeyDown="LimitTextArea(this)" onKeyUp="LimitTextArea(this)" οnkeypress="LimitTextArea(this)" ></textarea>

 

title="The textarea width must less than 300 characters." 放在textarea 里面提示输入最大字节数。

例如：<textarea title="The textarea width must less than 300 characters." cols=50 rows=10 name="comment" id="commentarea" onKeyDown="LimitTextArea(this)" onKeyUp="LimitTextArea(this)" οnkeypress="LimitTextArea(this)" ></textarea>

上面在写textarea中的属性时，会看到很多关于键盘输入的属性。一定不要忽略哦，，，，

本文转自：http://www.cnblogs.com/butterfly/archive/2009/04/27/1444598.html