• textarea限制输入长度


          最近公司的项目客户在使用时报错,研究后发现,textarea输入框,输入值的长度超过了数据库中定义的长度,所以造成了,前台的错误,因此要对前台输入框的输入的长度进行限制;经过研究后发现,一下几种方法可以较好地解决问题:

     备注:其实对于数据长度的验证,我们可以在提交前,以及提交后进行验证,但是我们的这个出现问题的,由于某些原因是不能在提交后进行验证,所以我研究了下几种前台验证的方式,供以后有需要的同志参考。

    第一种:

    其实最简单的方式是:在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>

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

    第三种:

    <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>

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

  • 相关阅读:
    [C#]mouse_event模拟点击时坐标参数无效?!
    体验boost::spirit
    喜讯,公司换宽屏液晶显示器了
    [疑难杂症]扩展AxWebBrowser的问题???
    VS 2005 BUG: 新增JScript文件编码问题引起乱码?
    在JavaScript中实现命名空间
    [C#]实现序列号生成器
    基于Web的仿WF工作流设计器
    分享:基于UDP协议实现可靠的数据传输
    远程控制之屏幕截取 小结
  • 原文地址:https://www.cnblogs.com/fengtengfei/p/fengtengfei.html
Copyright © 2020-2023  润新知