如何在不覆盖之前设置的节点上分配新的鼠标事件？

Question

例如：

domNode.onmouseover = function() { 
    this.innerHTML = "The mighty mouse is over me!" 
} 
domNode.onmouseover = function() { 
    this.style.backgroundColor = "yellow"; 
} 

在这个例子中，文本将不会改变。但事情也是，我并不总是知道什么是以前分配的，所以有办法告诉js：运行最终分配的所有东西，而不知道那是什么，然后运行我的函数？

Answer 1

有可能通过将当前的事件处理到新的处理要做到这一点：

domNode.onmouseover = function() 
{ 
    console.log('first handler'); 
} 
domNode.onmouseover = (function (current) 
{ 
    return function() 
    { 
     current();//call handler that was set when this handler was created 
     console.log('new handler'); 
    }; 
})(domNode.onmouseover);//pass reference to current handler 

See this fiddle，看到它在行动
你可以继续做这就像你想/需要：

domNode.onmouseover = function() 
{ 
    console.log('first handler'); 
} 
domNode.onmouseover = (function (current) 
{ 
    return function() 
    { 
     current(); 
     console.log('second handler'); 
    }; 
})(domNode.onmouseover); 
domNode.onmouseover = (function (current) 
{ 
    return function() 
    { 
     current(); 
     console.log('third handler'); 
    }; 
})(domNode.onmouseover); 

这将记录：

first handler 
second handler 
third handler 

这就是它的全部！

Answer 2

首先，将它放在document.ready中。 （不知道你是否做到了这一点） 如果你想要一个动作的2个动作将其放入一次函数。

您还可以创建2个函数并在您的鼠标悬停中调用它们。

$(document).ready(function(){ 
    domNode.onmouseover = function() { 
    this.innerHTML = "The mighty mouse is over me!" 
    this.style.backgroundColor = "yellow"; 
    } 
});