jQuery可以检查输入内容是否已更改？

Question

有可能以某种方式将javascript(jQuery是最好的)事件绑定到"更改"表单输入值吗？

我知道.change()方法,但是在你(光标)离开输入字段之前它不会触发.我也考虑过使用.keyup()方法,但它也会对箭头键等作出反应.

我只需要在输入中的文本每次更改时触发一个动作,即使它只有一个字母更改.

Answer 1

有一个简单的解决方案,即HTML5 input事件.所有主要浏览器的<input type="text">元素的当前版本都支持它,并且IE <9有一个简单的解决方法.有关更多详细信息,请参阅以下答案:

• jQuery键盘事件
• 仅捕获改变输入的按键？

示例(IE <9除外:请参阅上面的链接以获取解决方法):

$("#your_id").on("input", function() {
    alert("Change to " + this.value);
});

Answer 2

是的,将其与更改前的值进行比较.

var previousValue = $("#elm").val();
$("#elm").keyup(function(e) {
    var currentValue = $(this).val();
    if(currentValue != previousValue) {
         previousValue = currentValue;
         alert("Value changed!");
    }
});

另一种选择是仅在某些键上触发更改的功能.使用e.KeyCode要弄清楚什么是按键.

Answer 3

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");
    });        
});

这里是小提琴http://jsfiddle.net/Q9PqT/1/

Answer 4

您还可以将初始值存储在数据属性中,并使用当前值对其进行测试.

<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.