javascript - 获取附加到元素的所有事件处理程序

Question

我需要找到附加到 #mySelect 的所有事件处理程序，如果事件是通过 jQuery 创建的，我可以得到它，这里 alert(e) 将仅显示“更改”而不显示“单击”

JavaScript：

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

网页：

<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'));