0

我将以 keydown 事件监听器为例。

一个可以使用

$('#my-input').keydown(function(){
  //actions goes here
});

我了解上述事件侦听器在遇到 keydown 事件时会运行。

我需要一个像这样的“afterkeydown 事件”:

$('#my-input').afterkeydown(function(){
  //actions after keydown listener has occured
});

但是,我不想使用 keyup 事件侦听器或任何类型的计时器来实现此目的,因为当重复按住键并且计时器很慢时,keyup 事件侦听器不会触发。

在这些限制下是否可以在 keydown 上使用“回调事件侦听器”,如果可以,是否可以将其推广到所有 Jquery 事件侦听器?意思是,是否可以为 Jquery 创建一个 'afterclick'、'afterdrop'、'afterclick'、... 事件侦听器?

4

1 回答 1

0

由于听起来您真正想做的是在文本区域发生更改时收到通知,因此这是我用于该特定问题的一些代码。只要通过键盘、拖放、鼠标等更改了内容,它就会调用您的回调...

(function($) {

    var isIE = false;
    // conditional compilation which tells us if this is IE
    /*@cc_on
    isIE = true;
    @*/

    // Events to monitor if 'input' event is not supported
    // The boolean value is whether we have to 
    // re-check after the event with a setTimeout()
    var events = [
        "keyup", false,
        "blur", false,
        "focus", false,
        "drop", true,
        "change", false,
        "input", false,
        "textInput", false,
        "paste", true,
        "cut", true,
        "copy", true,
        "contextmenu", true
    ];
    // Test if the input event is supported
    // It's too buggy in IE so we never rely on it in IE
    if (!isIE) {
        var el = document.createElement("input");
        var gotInput = ("oninput" in el);
        if  (!gotInput) {
            el.setAttribute("oninput", 'return;');
            gotInput = typeof el["oninput"] == 'function';
        }
        el = null;
        // if 'input' event is supported, then use a smaller
        // set of events
        if (gotInput) {
            events = [
                "input", false,
                "textInput", false
            ];
        }
    }

    $.fn.userChange = function(fn, data) {
        function checkNotify(e, delay) {
            var self = this;
            var this$ = $(this);

            if (this.value !== this$.data("priorValue")) {
                this$.data("priorValue", this.value);
                fn.call(this, e, data);
            } else if (delay) {
                // The actual data change happens aftersome events
                // so we queue a check for after
                // We need a copy of e for setTimeout() because the real e
                // may be overwritten before the setTimeout() fires
                var eCopy = $.extend({}, e);
                setTimeout(function() {checkNotify.call(self, eCopy, false)}, 1);
            }
        }

        // hook up event handlers for each item in this jQuery object
        // and remember initial value
        this.each(function() {
            var this$ = $(this).data("priorValue", this.value);
            for (var i = 0; i < events.length; i+=2) {
                (function(i) {
                    this$.on(events[i], function(e) {
                        checkNotify.call(this, e, events[i+1]);
                    });
                })(i);
            }
        });
    }
})(jQuery);    

用法是:

 $("#whatever").userChange(yourCallbackFn, optionalData);
于 2013-08-05T06:56:51.613 回答