js监听textarea 内容的变化，并计算内容的长度c

 

html代码如下：

 

1.  
   <div class="customer-message">
2.  
   <label for="customerMessage">留言</label>
3.  
   <textarea id="customerMessage" maxlength="500o"></textarea>
4.  
   <p class="text-count"><span id="textCount">0</span>/500（留言多余10个字）</p>
5.  
   </div>

js代码如下：

 

1.  
   window.onload = function () {
2.  
   //获取文本内容和长度函数
3.  
   function txtCount(el) {
4.  
   var val = el.value;
5.  
   var eLen = val.length;
6.  
   return eLen;
7.  
   }
8.  
    
9.  
   var el = document.getElementById('customerMessage');
10.  
    el.addEventListener( 'input',function () {
11.  
    var len = txtCount(this); // 调用函数
12.  
    document.getElementById('textCount').innerHTML = len;
13.  
    });
14.  
     
15.  
    el.addEventListener( 'propertychange',function () {//兼容IE
16.  
    var len = txtCount(this); // 调用函数
17.  
    document.getElementById('textCount').innerHTML = len;
18.  
    });
19.  
    }

记录如上

 

 

转载于:https://www.cnblogs.com/lsongyang/p/10685310.html