textarea的maxlength属性兼容解决方案

IE10版本的textarea才支持maxlength属性；低版本的IE都不兼容，实际上低版本的IE的市场存在率还是很高的；

所以还是很有必要来整合一套解决方案的；

 

1. Jquery版本

   $(function () {
       $('textarea[maxlength]').on('keyup blur', function(event) {
           var maxlength = $(this).attr('maxlength');
           var val = $(this).val();
   
           if (val.length > maxlength) {
               /*这里是为了兼容win10自带输入法在字数到达极限值之后再输入中文会清空输入框的内容*/
               $(this).hide().show();
               
               $(this).val(val.substr(0, maxlength));
           }
           event.stopImmediatePropagation();
       });
   })

    

2. 纯js版本

   window.onload = function() {
       var txts = document.getElementsByTagName('TEXTAREA');
   
       for(var i = 0, l = txts.length; i < l; i++) {
           if(/^[0-9]+$/.test(txts[i].getAttribute("maxlength"))) {
               var func = function() {
                   var len = parseInt(this.getAttribute("maxlength"), 10);
   
                   if(this.value.length > len) {
                       /*同上*/
                       this.style.display="none";
                       this.style.display="block";
                       
                       this.value = this.value.substr(0, len);
                       return false;
                   }
               }
   
               txts[i].onkeyup = func;
               txts[i].onblur = func;
           }
       };
   }