Question

如何将事件处理程序从一个元素复制到另一个元素？例如：

$('#firstEl')
    .click(function() {
        alert("Handled!");
    })
;

// here's where the magic happens 
$('#secondEl').click = $('#firstEl').click; // ????

请注意，第二个元素正在处理第一个元素获取其处理程序的不同时间，这意味着：

$('#firstEl, #secondEl').click(function() { ... });

......将无效。

Answer 1

此问题已经得到解答，但供将来参考：您可以通过迭代原始元素的事件并将其处理程序绑定到目标来复制它们。

<强>＆GT;请参阅下面的编辑！

// iterate event types of original
$.each($('#original').data('events'), function() {
  // iterate registered handler of original
  $.each(this, function() {
    $('#target').bind(this.type, this.handler);
  });
});

当您无法控制原始元素（例如使用插件时）并且只想克隆某个元素的行为时，这很方便。

编辑：在以后的jQuery版本中，对元素事件处理程序的访问已更改。这适用于较新版本：

$.each($._data($('#original').get(0), 'events'), function() {
  // iterate registered handler of original
  $.each(this, function() {
    $('#target').bind(this.type, this.handler);
  });
});

干杯

Answer 2

你不能轻易（也可能不应该）“复制”这个事件。你可以做的是使用相同的功能来处理每个：

var clickHandler = function() { alert('click'); };
// or just function clickHandler() { alert('click'); };

$('#firstEl').click(clickHandler);

// and later
$('#secondEl').click(clickHandler);

或者，您实际上可以为第二个处理程序中的第一个元素触发事件：

$('#firstEl').click(function() {
    alert('click');
});

$('secondEl').click(function() {
    $('#firstEl').click();
});

编辑：@nickf担心污染全局命名空间，但通过将代码包装在对象中几乎总能避免这种情况：

function SomeObject() {
    this.clickHandler = function() { alert('click'); };
}
SomeObject.prototype.initFirstEvent = function() {
    $('#firstEl').click(this.clickHandler);
};
SomeObject.prototype.initSecondEvent = function() {
    $('#secondEl').click(this.clickHandler);
};

或将代码包装在匿名函数中并立即调用它：

(function() {
    var clickHandler = function() { alert('click'); };
    $('#firstEl').click(clickHandler);
    $('#secondEl').click(clickHandler);
})();

Answer 3

您可能对triggerHandler method

感兴趣

// here's where the magic happens 
//$('#secondEl').click = $('#firstEl').click; // ????
$('#secondEl').click(function() {
    $('#firstEl').triggerHandler('click');
});

Answer 4

这是你在找什么？

var clickHandler = function() { alert("Handled!"); }
$('#firstEl').click(clickHandler);
$('#secondEl').click(clickHandler);

Answer 5

http://www.learningjquery.com/2007/01/copy-events-from-one-element-to-another

Answer 6

$（'＃secondEl'）。click = $（'＃firstEl'）。click.bind（$（'＃secondEl'））;

假设您使用的是Prototype JS（http://www.prototypejs.org/api/function/bind）

将一个元素的事件处理程序复制到另一个元素上？

6 个答案: