獲取附加到元素的所有事件處理程序

Question

我需要找到附加到#mySelect的所有事件處理程序，如果事件是通過jQuery創建的，我可以得到它，這里alert（e）只顯示“change”而不是“click”

JavaScript：

$("#mySelect").change(function(){
    alert("changed");
})           
$.each($._data(  $("#mySelect")[0], "events" ), function(e) {
    alert(e);
})

Html：

<select id="mySelect" onclick="alert('hello')" >
    <option value="1">option 1</option>
    <option value="2">option 2</option>
    <option value="3">option 3</option>
    <option value="4">option 4</option>
</select>

Answer 1

簡短的回答是，使用javascript無法可靠地確定元素上的所有偵聽器。

答案很長，沒有標准機制來列出所有連接的偵聽器。 有些庫保留了使用庫附加的偵聽器列表，但不一定了解其他偵聽器。 通過測試相關的元素屬性和屬性（對每個元素的onclick ， onchange ， onblur等進行一些繁瑣的測試）可以找到標記中添加的或者作為元素屬性的監聽器。 但是找不到使用addEventListener或attachEvent添加的偵聽器是不可能的，除非在某處保留了引用並使其可用（請參閱有關庫的注釋）。

此外，還存在“委托”偵聽器，這些偵聽器在將元素附加到父元素時提供附加到元素的外觀。

Answer 2

$( '#mySelect' ).bind( {
    'change': function( event ) {

    },
    'click': function( event ) {

    }
});


$.each($._data(  $("#mySelect")[0], "events" ), function(e) {
    alert(e);
});

Answer 3

除了內聯附加的事件，您可以嘗試這樣做：

alert(document.getElementById('mySelect').getAttribute('onclick'));