为HTML输入元素中的每个实际更改触发一次处理程序

Question

我想触发事件处理程序,一旦每各实际变化的输入字段.例如,要验证(按键)输入信用卡号码(必须在每次更改时进行更改,因此解赎/限制不是答案).

我不能input单独使用,因为IE9不会从退格键或剪切/删除触发此事件.

我无法keyup单独使用,因为这不能处理鼠标的变化(例如粘贴).

我不能使用,change因为这只会触发blur.

我能做到,$('input').bind('input keyup', handler)但这会在大多数情况下触发两个不同的事件.假设处理程序很昂贵并且运行它两次是不可接受的.

我可以包装处理程序,以便它只在当前值与上次检查时不同时运行但是有更好的方法吗？

Answer 1

您在检查最后一个输入时所做的是您需要做的事情.

这是存储最后一个值的一种方法.

function handler(){ 
    var tb = jQuery(this);
    var currentValue = tb.val();
    if (tb.data("lastInput") !== currentValue) {
        tb.data("lastInput", currentValue);
        console.log("The current value is " + currentValue);
    } 
}
$('input').bind('input keyup', handler);

的jsfiddle

如果你真的不想在你的函数中使用那个逻辑,你总是可以扩展jQuery.它是一堆代码,但是一种方法.

(function(){
    $.fn.oneinput = function(callback) {        
        function testInput(){ 
            var tb = jQuery(this);
            var currentValue = tb.val();
            if (tb.data("lastInput") !== currentValue ) {
                tb.data("lastInput",currentValue );
                if(callback) { 
                    callback.call(this) 
                };
            }
            return this;
        }    
        jQuery(this).bind("keyup input", testInput);
    };
}(jQuery));

$('input').oneinput( function(){ console.log(this.value); });
?

的jsfiddle