存儲哪些對象事件

Question

我有一個div附帶兩個功能，一個是點擊，另一個是懸停功能。在JavaScript中有什麼方法可以找到與該元素附加的事件。如果我們將函數附加到某個元素，然後將它存儲在dom中。我們可以通過使用開發工具找到它

編輯：如何在瀏覽器/ DOM知道該事件被註冊與元素

<div id="test">test</div> 

腳本

document.getElementById('test').addEventListener('click',function(){},false) 

document.getElementById('test').addEventListener('hover',function(){},false) 

Answer 1

事件的屬性和方法在事件發生時自動發送給處理程序。所以你可以使用事件作爲處理程序的參數。事件的type屬性通知您有關事件類型。

document.getElementById('test') 
.addEventListener('click', function(evt){ /* evt is the event object */},false); 

要確定是否一個元件可以使用的情況下，查詢如果屬性（例如onmouseover）。如果它返回undefined，則該事件在該元素上不存在。

該片段顯示兩者。 type以紅色打印。

document.querySelector('#test').addEventListener('click', testfn); 
 
var res = document.querySelector('#result'); 
 
var canhover = document.querySelector('#test')['onhover']; 
 
var canclick = document.querySelector('#test')['onclick']; 
 
var canmousover = document.querySelector('#test')['onmouseover'] 
 

 
res.innerHTML = 'can hover be used with #test? '+ 
 
       (canhover === undefined ? 'no' : 'yes'); 
 
res.innerHTML += '<br>can click be used with #test? '+ 
 
       (canclick === undefined ? 'no' : 'yes'); 
 
res.innerHTML += '<br>can mouseover be used with #test? '+ 
 
       (canmousover === undefined ? 'no' : 'yes'); 
 

 

 
function testfn(evt) { 
 
    // browser compat 
 
    evt = evt || window.evt; 
 
    res.innerHTML = 'Event props (event was: <i>' + evt.type + '</i>)<hr>'; 
 
    for (var l in evt) { 
 
    if (/type/i.test(l)) { 
 
     res.innerHTML += '<b style="color:red">' + l +': '+evt[l]+'</b><br>'; 
 
    } else { 
 
     res.innerHTML += l +': '+evt[l]+'<br>'; 
 
    } 
 
    } 
 
}

#test { 
 
    cursor:pointer; 
 
    color: green; 
 
    margin-bottom: 1.5em; 
 
}

<div id="test">click me</div> 
 
<div id="result"></div>

Answer 2

你可以使用jQuery的Eventfilter和測試結果：

http://www.codenothing.com/archives/jquery/event-filter/

而且我發現在GitHub上這個jQuery插件：https://github.com/sebastien-p/jquery.hasEventListener