如何通过附加到它的事件来查找元素

时间:2012-12-21 19:07:33

标签: jquery

我知道我可以附加像这样的自定义事件

$("#customDropdownBox").on("clickOutside", function(){
    $(this).hide(300, hideCallback);
})

我知道我可以在主体上附加一个点击事件,以找到每个附加了自定义事件的元素,如下所示

$("body").on("click", function(event){
    $.each($("body *"), function(i, o){
        if($._data(o, "events") && $._data(o, "events")["clickOutside"])
            $(o).trigger("clickOutside");
    })
})

我想知道是否有更快的方法可以实现这一点而无需遍历DOM的所有(*)元素。我知道我可以使用像

这样的东西进行过滤
$("body div.classx")

但我宁愿不对特定ID或类进行硬编码。我想知道是否有一种可以实现这一目标的选择器。像

这样的东西
$("body *{event:'clickOutside'}")

$.findEvent("clickOutside");

1 个答案:

答案 0 :(得分:0)

+1 @Kevin B.我今天学会了新词“猴子补丁”和“鸭子打孔”:)。这就是我所做的。这是代码。修补“on”和“off”方法的猴子修补,详见here和循环here

// Monkey patch on and off methods
(function($, window){
    window.clickOutside = [];
    var _oldOn = $.fn.on;
    $.fn.on = function(event,handler){
        if(event == "clickOutside"){
            $.fn.off.apply(this, arguments); // make sure the event is never registered twice
            window.clickOutside.push(this[0]);
        }
        return _oldOn.apply(this, arguments);
    };
    var _oldOff = $.fn.off;
    $.fn.off = function(event,handler){
        if(event == "clickOutside"){
            $.each(window.clickOutside, function(i, o){
                if(this == o){
                    window.clickOutside.splice(i, 1);
                }
            })
        }
        return _oldOff.apply(this, arguments);
    };
})(jQuery, window);

现在我的监听功能现在如下

// Listen for clickOutside/clickElseWhere events
$("body").on("click", function(event){
    var $target = $(event.target);
    $.each(window.clickOutside, function(i, o){
        if($._data(o, "events") && $._data(o, "events")["clickOutside"] && !$(o).find("*").andSelf().has($target).length){
            $(o).trigger("clickOutside");
        }
    });
});

让我只循环播放具有该特定事件的元素。