的Javascript的onclick

Question

我有一個像

<a id='lnk1' onclick='do something' >test</a> 

在後面的代碼添加到同一個錨標記像

lnk = document.getElementById('lnk1') 
lnk.onclick = function() { do something} 

現在正在發生的事情的代碼是，在第二一段代碼的onclick功能錨標籤被覆蓋。我想要發生的是第一個onclick的代碼運行，然後運行第二個onclick。

Answer 1

有一個非常簡單的，符合標準的方式來做到這一點：

lnk1.addEventListener('click', function() { 
    // do something 
}); 

這並不在IE 9版本之前的工作，所以你需要這樣做：

var handler = function() { 
    // do something 
}; 

if ("addEventListener" in lnk1) { // standards-compliant browsers 
    lnk1.addEventListener('click', handler); 
} else { // Internet Explorer < v9 
    lnk1.attachEvent('onclick', handler); 
} 

這將起作用，並且HTML屬性和上面的代碼中指定的原始函數都將運行。但是，如果在同一個地方定義所有的事件處理程序將會更好：在Javascript中。認真考慮從HTML屬性中移除事件處理邏輯。

Answer 2

你可以試試這個：

var lnk = document.getElementById('lnk1'); // don't forget var! 

var oldHandler = lnk.onclick; 
lnk.onclick = function(ev) { 
    if (oldHandler) oldHandler(ev); 
    // do something ... 
}; 

該代碼保存到舊處理程序的引用，如果不爲空它做其他任何新的處理程序想要做之前調用它。

您可以將之後的舊代碼打到新代碼或混入其中或其他任何地方。

Answer 3

<a id='lnk1' onclick='do something' >test</a> 

的JavaScript

lnk1 = document.getElementById('lnk1') 
    lnk1.addEventListener('click',function() { do something}, false); 

設置的onclick您覆蓋現有屬性的時候，而是通過事件偵聽器分配點擊那麼這將是好的。

Answer 4

您的陳述有誤：

JAVASCRIPT

lnk = document.getElementById('lnk1') 
lnk1.onclick = function() { do something} \\ replace lnk1 with lnk 
lnk.onclick = function() { do something} \\ this will work 

您已經定義lnk爲可變的，但你用onclick事件調用lnk1。這是一個錯誤的陳述。

使用HTML

<a id='lnk1'>test</a> 

見演示：http://jsfiddle.net/tm5cX/