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

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