在JavaScript中为函数添加行为？

假设我正在编写一个web应用程序，并且我希望在某个函数已经在多个位置声明之后添加某些行为，而不会覆盖该函数的旧行为。在JavaScript中为函数添加行为？

下面是一些简单的代码（注意window.onmousedown功能

var createMenu = function(){ 
    var menu = document.createElement('ul'); 
    /* add things to the menu */ 
    window.onmousedown = function(e){ 
     menu.style.background = "red"; 
    } 
} 

var createSidebar = function(){ 
    var sidebar = document.createElement('div'); 
    /* add things to the sidebar */ 
    window.onmousedown = function(e){ 
     sidebar.id = "clicked"; 
    } 
} 

var createMenu(); 
var createSidebar();

在这种情况下，window.onmousedown不会做两件事，它的意思做的事情 - 它在createSidebar定义将是否有一种标准的方式来实现windows.onmousedown将保留两种行为的行为？

来源

2012-07-13 tborenst

是，不要使用直列事件*。请参阅'addEventListener'和（对于IE）'attachEvent'，或者，更容易.. jQuery [或您选择的框架] :) – 2012-07-13 22:13:16

使用addEventListener()添加您的事件。它允许您注册事件的多个事件处理程序一个元素。忘记您在示例中使用的旧事件模型。对于IE8及更高版本，您将不得不使用attachEvent()。

Advanced event registration models on Quirksmode

来源

2012-07-13 22:13:02 kapa

谢谢！这绝对是我的知识上的一个缺口，我将从现在开始使用事件监听器。你知道是否有触摸设备的“点击”事件？现在我必须使用menu.ontouchstart = doStuff（） - 这被认为是不好的做法？ – tborenst 2012-07-13 23:02:32

'touchstart'应该没问题，afaik - 只需附加高级事件模型即可。像jQuery这样的库可以帮助很多人附加和管理事件处理程序，因为它隐藏了浏览器差异。（我相信你的意思是简单的'doStuff'没有括号） – kapa 2012-07-14 09:31:35

这不是最好的做法，但你可以做这样的事情：

var createMenu = function(){ 
    var menu = document.createElement('ul'); 
    /* add things to the menu */ 
    window.onmousedown = function(e){ 
     menu.style.background = "red"; 
    } 
} 

var createSidebar = function(){ 
    var sidebar = document.createElement('div'); 
    var oldonmousedown = window.onmousedown; 
    /* add things to the sidebar */ 
    window.onmousedown = function(e){ 
     sidebar.id = "clicked"; 
     oldonmousedown() 
    } 
} 

var createMenu(); 
var createSidebar();

但是，你应该使用addEventListener()或attachEvent()像bažmegakapa's answer

来源

2012-07-13 22:25:21 Moshe

在JavaScript中为函数添加行为？

回答

相关问题