简化 jQuery 以检测输入值的变化

Simplify jQuery for detecting change of an input's value

本文关键字:变化 输入 检测 jQuery 简化      更新时间:2023-09-26

我正在跟踪输入文本区域的字符数<140。我目前只在"keyup"上捕获字符,但也想跟踪用户是否复制/粘贴到文本区域。有什么建议吗?

$(function(){
  var limitDiv = $("#limit");
  var limit = limitDiv.data("limit");
  var button = $("input");
  $("textarea").on("keyup", function(){
    var total = this.value.length;
    var diff = limit- total;
    var condition = diff < 0 || total === 0;
    limitDiv.text(diff).toggleClass("red", condition);
    button.prop("disabled", condition);
  }).trigger("keyup");
})

jQuery中有一个paste事件,尽管它不是经常使用。截至jQuery 2.1.0.,它似乎仍然有效

$("#input").on("paste", function(e){
      //code goes here
  }); 

http://jsfiddle.net/gty70qc9/2/

只需添加一个粘贴事件:

$(function(){
  var limitDiv = $("#limit");
  var limit = limitDiv.data("limit");
  var button = $("input");
  $("textarea").on("keyup paste", function(){
    var total = this.value.length;
    var diff = limit- total;
    var condition = diff < 0 || total === 0;
    limitDiv.text(diff).toggleClass("red", condition);
    button.prop("disabled", condition);
    button.value(total);
  });
})
textarea {
  width: 100%;
  height: 30px;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<textarea></textarea>
<input type="button" value="Submit">
<div id="limit" data-limit="15"></div>