JS实时计算textarea输入文字长度

使用场景

使用textarea，然后限制输入的长度，实时在textarea末尾显示剩余可输入的字节数

判断点：

监听键盘按下事件
剔除换行符占位数
更新剩余个数显示

解决办法

JS事件

function wordStatic(input) { 
  // 获取要显示已经输入字数文本框对象 
  var content = document.getElementById('num'); 
  if (content && input) { 
      // 获取输入框输入内容长度并更新到界面 
      var value = input.value; 
      // 将换行符不计算为单词数 
      value = value.replace(/\n|\r/gi,""); 
      // 更新计数 
      content .innerText = value.length; 
  } 
}

VUE写法

<textarea class="remark" placeholder="请填写您要说的内容" cols="30" rows="10" @keyup="wordStatic($event)" v-model="postdata.returnVisit"></textarea>
<div class="shownum"><span>{{count?count:'0'}}</span>/200</div>

wordStatic(e){
 if (e) {
          const value = e.target.value;
          if (value.replace(/[\r\n]/g, "").length > 200) {
              this.remarktxt = value.substring(0, 200);
              return;
          } else {
              this.count = value.replace(/[\r\n]/g, "").length;
          }
      }
  }

HTML

 <textarea onkeyup="wordStatic(this);" maxlength="120" rows="3"></textarea> 
 <div><span id="num">0</span>/120</div>