2011-06-02 124 views
4

假设有一个<img>元素具有一些事件处理程序。例如,点击它确实是alert("OldEventHandler")在现有处理程序之前附加我的事件处理程序

我想在现有的之前添加我的事件处理程序。例如我的事件处理程序函数确实是alert("NewEventHandler")

所以点击我想看到“NewEventHandler”弹出窗口,然后是“OldEventHandler”弹出。

这需要在纯JavaScript中实现; 没有jQuery请。

回答

11

您可以保存原来的处理程序,然后调用它你完成后:

var oldHandler = myElement.onclick; 

myElement.onclick = function() { 
    // do your stuff here 
    ... 

    // then call the original 
    oldHandler.apply(this, arguments); 
} 
+0

听起来很合理,谢谢,我会试试看。 – 2011-06-02 20:43:30

+0

似乎不工作,如果添加addEventListener处理程序除了onclick(它们将首先被调用第一个) – 2017-03-03 12:08:20

+0

@ alex_1948511可能取决于添加了“addEventListener”的处理程序是否注册为_capturing_处理程序或_bubbling_处理程序。 '.onclick'处理程序被视为后者,并发生在捕获处理程序之后。 http://www.quirksmode.org/js/events_order.html – Alnitak 2017-03-03 12:46:32

0

这个问题的另一种方法是创建一个存储的功能的阵列在一些一通用事件处理程序预定义顺序。当触发onclick()事件时,您可以按照该顺序调用所需的函数。

+0

这将工作,如果所有处理函数将被设置为我。但在这种情况下 - 默认事件处理程序是由外部代码(我无法访问)设置的,我不想完全防止它。我只想在它之前插入我的处理程序。 – 2011-06-02 20:41:16