如何裝飾DO​​M節點的事件處理程序？

Question

如何裝飾DO​​M節點，以便添加事件處理程序，但在新的處理程序中，您可以調用以前的處理程序？

Answer 1

我假設你是綁定事件的方式element.onclick = function() {};。

是的，你可以做一個包裝前面的事件處理函數，並依次執行它們，例如：

function addEvent(el, event, handler) { 
    var oldEvent = el['on'+event]; 
    if (typeof oldEvent != 'function') { 
    el['on'+event] = handler; 
    } else { 
    el['on'+event] = function() { 
     oldEvent(); 
     handler(); 
    } 
    } 
} 

var el = document.getElementById('el'); 
addEvent(el, 'click', function() { alert('1'); }); 
addEvent(el, 'click', function() { alert('2'); }); 

檢查上面的例子here。

Answer 2

這取決於你如何將你的處理器，當然，但這裏有一個老式的方法：

function addClickHandler(nodeId, handler) { 
    var node = document.getElementById(nodeId), old = node.onclick; 
    node.onclick = function() { 
    handler(old); 
    } 
} 

你的處理函數會檢查它的參數，看它是否不爲空。

你當然可以像你想要的那樣喜歡這裏。請注意，大多數Javascript框架實際上不會爲您的事件處理程序提供有關其他處理程序的大量信息。一般來說，處理這種關係是一種脆弱的模式，但是我想如果你用一個規範處理器設置的設計開始工作，它可以正常工作。