只捕捉改变输入的按键？

Question

当按键更改文本框的输入时，我想做一些事情。我认为keypress 事件最适合这个，但我怎么知道它是否引起了变化？我需要过滤掉诸如按箭头键或修饰符之类的东西...我不认为硬编码所有值是最好的方法。

那我该怎么做呢？

Answer 1

在大多数浏览器中，您可以将 HTML5 input 事件用于 text-type <input> 元素：

$("#testbox").on("input", function() {
    alert("Value changed!");
});

这在 IE propertychange 事件。

$("#testbox").on("propertychange", function(e) {
    if (e.originalEvent.propertyName == "value") {
        alert("Value changed!");
    }
});

IE 9 支持两者，因此在该浏览器中，最好选择基于标准的input 事件。这很方便首先触发，因此我们可以在input 第一次触发时删除propertychange 的处理程序。

把它们放在一起 (jsFiddle)：

var propertyChangeUnbound = false;
$("#testbox").on("propertychange", function(e) {
    if (e.originalEvent.propertyName == "value") {
        alert("Value changed!");
    }
});

$("#testbox").on("input", function() {
    if (!propertyChangeUnbound) {
        $("#testbox").unbind("propertychange");
        propertyChangeUnbound = true;
    }
    alert("Value changed!");
});

Answer 2

.change() 是你所追求的

$("#testbox").keyup(function() {
   $(this).blur();
   $(this).focus(); 
   $(this).val($(this).val()); // fix for IE putting cursor at beginning of input on focus
}).change(function() {
   alert("change fired");
});

Answer 3

我会这样做：http://jsfiddle.net/JesseAldridge/Pggpt/1/

$('#input1').keyup(function(){
    if($('#input1').val() != $('#input1').attr('prev_val'))
        $('#input2').val('change')
    else
        $('#input2').val('no change')
    $('#input1').attr('prev_val', $('#input1').val())
})

Answer 4

我想出了这个来自动保存文本区域。它使用.keyUp() jQuery 方法的组合来查看内容是否发生了变化。然后我每 5 秒更新一次，因为我不希望每次更改时都提交表单！！！！

var savePost = false;

jQuery(document).ready(function() { 
    setInterval('autoSave()', 5000)
    $('input, textarea').keyup(function(){
        if (!savePost) {
            savePost = true;    
        }
    })
})


function autoSave() {
    if (savePost) {
        savePost = false;
        $('#post_submit, #task_submit').click();            
    }
}

我知道即使内容没有改变它也会触发，但是硬编码我不希望它工作的键更容易。