在jQuery中绑定事件后,如何获得对事件处理函数的引用?

Once an event is bound in jQuery how do you get a reference to the event handler function?

本文关键字:事件 处理函数 引用 何获得 jQuery 绑定      更新时间:2023-09-26

如果我附加一个点击事件处理程序:

$(".selector").bind("click", function () {
  // some handler function
});

如何获得该函数的引用?这行不通:

var refToFunc = $(".selector").bind("click");
typeof refToFunc === "object";  // I want the function

我认为bind("eventname")在这种情况下只是返回jQuery对象,而不是事件处理函数。

非常有趣的问题。您可以像这样检索它:

var refToFunc = $(".selector").data("events")["click"][0].handler;

注意,我们使用[0]是因为您有一个处理程序数组,以防绑定多个处理程序。对于其他事件,只需更改为事件名称。

编辑一般来说,你可以使用下面的插件来获取事件所选元素的所有处理程序(代码尚未优化):

$.fn.getEventHandlers = function(eventName){
  var handlers = [];
  this.each(function(){
     $.each($(this).data("events")[eventName], function(i, elem){
         handlers.push(elem.handler);    
     });     
  });
  return handlers;
};

如何使用?:

$(".selector").getEventHandlers("click");

它将返回一个包含所有事件处理程序的函数数组。

对于你的具体问题,你可以这样使用这个插件:

var refToFunc = $(".selector").getEventHandlers("click")[0];

希望这对你有帮助。欢呼声

事件处理程序保存在数据对象中,可通过data访问。例如:

$('.selector').data('events').click[0].handler;

这将获得绑定到该函数的click事件的第一个事件处理程序函数。


如果你想为函数保留一个引用,例如为了解绑定它,最好将它存储在一个变量中或使其成为一个命名函数。

var handler = function() {
    // some content
});
$('.selector').bind('click', handler);

下面是我最终得到的函数:

var getEventHandlers = function ($object, eventName) {
    var handlers = [],
        eventHandlers = $object.data("events")[eventName];
    if (eventHandlers && eventHandlers.length > 0) {
        for (var i = 0, l = eventHandlers.length; i < l; i++) {
            handlers.push(eventHandlers[i].handler);
        }
    }
    return handlers;
},
setEventHandlers = function ($object, eventName, handlers) {
    if (handlers && handlers.length > 0) {
        for (var i = 0, l = handlers.length; i < l; i++) {
            $object.bind(eventName, handlers[i]);
        }
    }
};