是否有可能在动态添加的文本输入上全局捕获keydown?

时间:2013-12-16 15:02:18

标签: javascript jquery ajax autocomplete jquery-ui-autocomplete

我正在使用以下全局jQuery来显示和隐藏div次调用的加载$.ajax

$(document).ajaxStart(function(){
    $("#loading").show();
}
$(document).ajaxStop(function(){
    $("#loading").hide();
}

这很好用,但我不想显示自动填充的加载div,所以我添加了这个:

$("input[type=text]").keydown(function(){
    if($(this).hasClass('ui-autocomplete-input')) {
        window.suppressGlobal = true;
    }
});

然后,要为“普通”suppressGlobal来电重置$.ajax,请执行以下操作:

var origAjax = $.ajax;
$.ajax = function() {
    if (window.suppressGlobal) {
        arguments[0].global = false;
    }
    origAjax.apply(this, arguments);
    window.suppressGlobal = false;
};

这一切都适用于使用页面加载构造的文本输入。但是,我有几种情况,使用jQuery / Javascript在客户端动态插入文本输入,在这种情况下, keydown事件不会绑定到全局函数。我也试过on

$("input[type=text]").on('keydown', function(){
    if($(this).hasClass('ui-autocomplete-input')) {
        window.suppressGlobal = true;
    }
});

但这也不起作用。有没有一种方法可以全局捕获keydown事件,无论何时添加文本输入?我可以以某种方式全局捕获添加到DOM的文本输入并附加事件处理程序吗?

1 个答案:

答案 0 :(得分:3)

您必须使用$(document).on()来动态创建控件。

jsfiddle:http://jsfiddle.net/G9qJE/

您也可以使用:$('body').on

说明: 分配事件时,它仅分配给页面上当前存在的元素。如果你以后使用其他元素,那么没有什么可以观察到那些元素的监视也允许它们被使用。      这就是为什么你需要一些知道事件和你想要应用它的元素的文档级别的东西,以便它可以监视任何匹配的新元素并将该事件应用于它们。

 $(document).on("keydown", "input[type=text]", function() { 
        if($(this).hasClass('ui-autocomplete-input')) {
            window.suppressGlobal = true;
        }

    });