如何对textarea进行计数,如果超过固定值就不能在录入

最新推荐文章于 2022-11-29 20:21:08 发布

The_Best_Hacker

最新推荐文章于 2022-11-29 20:21:08 发布

阅读量1.4k

点赞数 2

分类专栏：项目总结文章标签： textarea

项目总结专栏收录该内容

28 篇文章 0 订阅

订阅专栏

需求推动发展。。。

第一种：

其实最简单的方式是：在submit提交前进行这样的if判断，不用js验证即可，而且较为直观

if(document.getElementById("textarea的id的名字").value.length >200){
   alert您输入的字数超出限制，最多录入200个字。");
   return false;
  }

第二种：

<html>
    <head>
        <title>
        </title>
        <script type="text/javascript">
            var textarea_maxlen = {
                isMax: function(max_length) {
                    var textarea = document.getElementById("area");
                    if (textarea.value.length > max_length) {
                        textarea.value = textarea.value.substring(0,max_length);
                    }
                },
                disabledRightMouse: function() {
                    document.oncontextmenu = function() {
                        return false;
                    }
                },
                enabledRightMouse: function() {
                    document.oncontextmenu = null;
                }
            };
        </script>
    </head>
    <body>
 请输入内容：
        <br><textarea id="area"  onkeyup="textarea_maxlen.isMax(10)" onfocus="textarea_maxlen.disabledRightMouse()"
        onblur="textarea_maxlen.enabledRightMouse()" >
        </textarea>
    </body>
</html>

总结：这种方法在输入达到最大限制后，是无法输入进去，较为合理的解决了这样的问题

如过只是单纯的想限制字数，并不想写太多的话： οnkeyup="this.value = this.value.slice(0, 80)"

第三种：

<html>
<head>
<title>限制Textare输入数值的个数</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,10);"
       onKeyUp="textCounter(this.form.message,
       this.form.remLen,10);">
    </textarea>
      您还可以输入:<input name="remLen" type="text" value="10" size="3" readonly="readonly">个字符 
   </form>
 </body>
</html>

总结：这种方法可以较为直观的显示出输入框中还能输入多少字符。

转载自：https://www.cnblogs.com/fengtengfei/p/fengtengfei.html?utm_source=tuicool

The_Best_Hacker

关注

2
点赞
踩
3

收藏

觉得还不错? 一键收藏
1
评论
如何对textarea进行计数,如果超过固定值就不能在录入

需求推动发展。。。第一种：其实最简单的方式是：在submit提交前进行这样的if判断，不用js验证即可，而且较为直观if(document.getElementById("textarea的id的名字").value.length >200){ alert您输入的字数超出限制，最多录入200个字。"); return false; }第二种：<h...
复制链接

扫一扫