JS实现控制Textarea文本域字符数

2022-11-28

本文向大家简单介绍一下JS如何实现限制Textarea文本域字符个数，这里和大家分享一下的代码可以适时显示可以继续输入的字符长度。

JS限制Textarea文本域字符个数

用JavaScript限制一个文本框TEXTAREA输入字符多少进行限制，常见于留言板或评论功能上，这一个是限制用户不能超过多少字符，和最低需要输入多少字符正好相反。本代码可以适时显示可以继续输入的字符长度。

 
 
 
  
  
  <html> 
  
  
  <head> 
  
  
  <title>JS限制Textarea文本域字符个数</title> 
  
  
  <meta http-equiv="Content-Type" 
  
  
  content="text/html; charset=gb2312" /> 
  
  
  <SCRIPT LANGUAGE="JavaScript">    
  
  
  <!--//    
  
  
  function textCounter(field, countfield, maxlimit) {    
  
  
  // 函数，3个参数，表单名字，表单域元素名，限制字符；    
  
  
  if (field.value.length > maxlimit)    
  
  
  //如果元素区字符数大于最大字符数，按照最大字符数截断；    
  
  
  fieldfield.value = field.value.substring(0, maxlimit);    
  
  
  else    
  
  
  //在记数区文本框内显示剩余的字符数；    
  
  
  countfield.value = maxlimit - field.value.length;    
  
  
  }    
  
  
  //-->    
  
  
  </SCRIPT> 
  
  
  </head> 
  
  
  <body> 
  
  
  <form name=myform action=""> 
  
  
    <textarea name="message" cols="28" rows="5" 
  
  
  onKeyDown="textCounter(this.form.message,this.form.remLen,125);"
  
  
   onKeyUp="textCounter(this.form.message,
  
  
  this.form.remLen,100);"></textarea> 
  
  
    您还可以输入:<input name="remLen" type="text" 
  
  
  value="100" size="5" readonly="readonly">个字符  
  
  
  </form> 
  
  
  </body> 
  
  
  </html>

【编辑推荐】

Javascript解决浏览器兼容问题12个技巧
JS脚本兼容性问题解决方案
解析Javascript对select下拉列表操作
技术分享如何识别控制DHTML和JS中的页面元素
深入学习JavaScript中Function对象语法

作者：后浪云

链接：https://www.idc.net/help/397743/

文章版权归作者所有，未经允许请勿转载。

THE END