JQuery为textarea添加maxlength属性的代码

通过JQuery的keyup事件:

  

复制代码 代码如下:

  <html>

  <head>

  <title>JQuery为textarea添加maxlength</title>

  <script type="text/javascript" src="jquery-1.4.js"></script>

  </head>

  <body>

  <textarea style="width:300px; height:60px;" maxlength="10"></textarea>

  </body>

  </html>

  <script type="text/javascript">

  $(function(){

  $("textarea[maxlength]").keyup(function(){

  var area=$(this);

  var max=parseInt(area.attr("maxlength"),10); //获取maxlength的值

  if(max>0){

  if(area.val().length>max){ //textarea的文本长度大于maxlength

  area.val(area.val().substr(0,max)); //截断textarea的文本重新赋值

  }

  }

  });

  });

  </script>

  如果只用keyup只能判断键盘输入的maxlength,利用鼠标的粘贴还是可以超过maxlength的限制,可以利用blur事件做判断:

  

复制代码 代码如下:

  $("textarea[maxlength]").blur(function(){

  var area=$(this);

  var max=parseInt(area.attr("maxlength"),10); //获取maxlength的值

  if(max>0){

  if(area.val().length>max){ //textarea的文本长度大于maxlength

  area.val(area.val().substr(0,max)); //截断textarea的文本重新赋值

  }

  }

  });

  失去焦点后截断textarea的文本。

  通过blur事件判断后还是有问题,如果是粘贴后直接提交而没有做对textarea的长度验证的情况下,还是会把textarea的全部内容提交。