我有一个页面,其中一些事件监听器被连接到输入框和选择框。有没有办法找出哪些事件监听器在观察一个特定的DOM节点以及什么事件?
事件是通过以下方式连接的。
1.Prototype's Event.observe
。
2.DOM'的addEventListener
。
3.作为元素属性element.onclick
。
这取决于事件的连接方式。为了说明问题,假设我们有以下的点击处理程序。
var handler = function() { alert('clicked!') };
我们将使用不同的方法将其附加到我们的元素上,有些方法允许检查,有些则不允许。
方法A)单一事件处理程序
element.onclick = handler;
// inspect
alert(element.onclick); // alerts "function() { alert('clicked!') }"
方法B)多个事件处理程序
if(element.addEventListener) { // DOM standard
element.addEventListener('click', handler, false)
} else if(element.attachEvent) { // IE
element.attachEvent('onclick', handler)
}
// cannot inspect element to find handlers
方法C):jQuery
$(element).click(handler);
1.3.x
// 检查
var clickEvents = $(element).data("events").click;
jQuery.each(clickEvents, function(key, value) {
alert(value) // 警报 "function() { alert('clicked!') }"
})
1.4.x (将处理程序存储在一个对象内)
// 检查
var clickEvents = $(element).data("events").click;
jQuery.each(clickEvents, function(key, handlerObj) {
alert(handlerObj.handler) // 警报 "function() { alert('clicked!') }"
// 也可使用: handlerObj.type, handlerObj.namespace
})
(见jQuery.fn.data
和jQuery.data
)。
方法D)。)原型(混乱的)。
$(element).observe('click', handler);
1.5.x
// 检查
Event.observers.each(function(item) {
if(item[0] == element) {
alert(item[2]) // alerts "function() { alert('clicked!') }"
}
})
1.6到1.6.0.3,包括在内(这里变得非常难)。
// 检查。"_eventId "是针对<1.6.0.3,而
// "_prototypeEventID "是在1.6.0.3中引入的
var clickEvents = Event.cache[element._eventId || (element._prototypeEventID || [])[0]].click;
clickEvents.each(function(wrapper){
alert(wrapper.handler) // alerts "function() { alert('clicked!') }"
})
1.6.1 (稍好)
// 检查
var clickEvents = element.getStorage().get('prototype_event_registry').get('click')。
clickEvents.each(function(wrapper){
alert(wrapper.handler) // alerts "function() { alert('clicked!') }"
})
如果你有Firebug,你可以使用console.dir(object or array)
在控制台日志中打印出任何JavaScript标量、数组或对象的漂亮树形图。
试试吧。
console.dir(clickEvents);
或
console.dir(window);