是否可以将 javascript（最好是 jQuery）事件绑定到以某种方式“更改”表单输入值？
我知道.change() 方法，但在您（光标）离开输入字段之前它不会触发。我也考虑过使用.keyup() 方法，但它也会对箭头键等做出反应。
我只需要每次触发一个动作，输入中的文本发生变化，即使只是一个字母变化。
【问题讨论】：
标签： javascript jquery input onchange
有一个简单的解决方案，就是 HTML5 input 事件。所有主要浏览器的当前版本都支持 <input type="text"> 元素，并且对于 IE
示例（IE
$("#your_id").on("input", function() {
alert("Change to " + this.value);
});
【讨论】：
input 事件的快捷方法，但jQuery 仍然使用on() 为该事件添加一个监听器。证明：jsfiddle.net/QA5hN
<input type="text">，也适用于<textarea>和<select>，因为我测试过（在chrome上）。
是的，将其与更改前的值进行比较。
var previousValue = $("#elm").val();
$("#elm").keyup(function(e) {
var currentValue = $(this).val();
if(currentValue != previousValue) {
previousValue = currentValue;
alert("Value changed!");
}
});
另一种选择是仅在某些键上触发您更改的功能。使用e.KeyCode 找出按下的键。
【讨论】：
您还可以将初始值存储在数据属性中，并根据当前值进行检查。
<input type="text" name="somename" id="id_someid" value="" data-initial="your initial value" />
$("#id_someid").keyup(function() {
return $(this).val() == $(this).data().initial;
});
如果初始值没有改变，则返回 true。
【讨论】：
function checkChange($this){
var value = $this.val();
var sv=$this.data("stored");
if(value!=sv)
$this.trigger("simpleChange");
}
$(document).ready(function(){
$(this).data("stored",$(this).val());
$("input").bind("keyup",function(e){
checkChange($(this));
});
$("input").bind("simpleChange",function(e){
alert("the value is chaneged");
});
});
【讨论】：
您可以在 jQuery 中使用数据并捕获所有事件，然后根据它的最后一个值（未测试）对其进行测试：
$(document).ready(function() {
$("#fieldId").bind("keyup keydown keypress change blur", function() {
if ($(this).val() != jQuery.data(this, "lastvalue") {
alert("changed");
}
jQuery.data(this, "lastvalue", $(this).val());
});
});
这对于一长串项目也很有效。使用jQuery.data 意味着您不必创建javascript 变量来跟踪值。您可以通过$("#fieldId1, #fieldId2, #fieldId3, #fieldId14, etc") 跟踪许多字段。
更新：将blur 添加到bind 列表中。
【讨论】：
我不得不将这种代码用于将内容粘贴到字段中的扫描仪
$(document).ready(function() {
var tId,oldVal;
$("#fieldId").focus(function() {
oldVal = $("#fieldId").val();
tId=setInterval(function() {
var newVal = $("#fieldId").val();
if (oldVal!=newVal) oldVal=newVal;
someaction() },100);
});
$("#fieldId").blur(function(){ clearInterval(tId)});
});
未测试...
【讨论】：
我认为没有“简单”的解决方案。您可能需要同时使用 onKeyUp 和 onChange 事件，以便您还可以捕捉到使用鼠标进行更改的时间。每次调用您的代码时，您都可以将您“看到”的值存储在附加到该字段的 this.seenValue 上。这应该会更容易一些。
【讨论】：
input 事件。看我的回答。
您可以在键和鼠标事件的组合上设置事件，当然也可以设置 onblur。在这种情况下，存储输入的值。在下一次调用中，将当前值与最后存储的值进行比较。只有在实际发生变化时才施展你的魔法。
以或多或少干净的方式做到这一点：
您可以将数据与 DOM 元素相关联（查找 api.jquery.com/jQuery.data），因此您可以编写一组通用的事件处理程序，分配给表单中的所有元素。每个事件都可以将触发它的元素传递给一个通用函数。该函数可以将旧值添加到元素的数据中。这样，您应该能够将其实现为适用于整个表单以及从现在开始编写的每个表单的通用代码。 :) 我猜它可能只需要大约 20 行代码。
这个小提琴中有一个例子：http://jsfiddle.net/zeEwX/
【讨论】：
由于用户可以进入操作系统菜单并使用鼠标选择粘贴，因此没有安全事件会为您触发此操作。我发现始终有效的唯一方法是设置一个 setInterval 来检查输入值是否已更改：
var inp = $('#input'),
val = saved = inp.val(),
tid = setInterval(function() {
val = inp.val();
if ( saved != val ) {
console.log('#input has changed');
saved = val;
},50);
您也可以使用 jQuery 特殊事件进行设置。
【讨论】：