Giriş kutularına ve seçim kutularına bazı olay dinleyicilerinin eklendiği bir sayfam var. Hangi olay dinleyicilerinin belirli bir DOM düğümünü ve hangi olay için gözlemlediğini bulmanın bir yolu var mı?
Olaylar kullanılarak eklenir:
Event.observe
;39;un
addEventListener`;element.onclick
.Sadece bir sayfada neler olup bittiğini incelemeniz gerekiyorsa, Visual Event yer işaretini deneyebilirsiniz.
Güncelleme: Görsel Etkinlik 2 mevcut;
Bu, olayların nasıl bağlandığına bağlıdır. Örnek olarak aşağıdaki tıklama işleyicisine sahip olduğumuzu varsayalım:
var handler = function() { alert('clicked!') };
Bazıları denetime izin veren, bazıları da izin vermeyen farklı yöntemler kullanarak bunu elemanımıza ekleyeceğiz.
Yöntem A) tek olay işleyici
element.onclick = handler;
// inspect
alert(element.onclick); // alerts "function() { alert('clicked!') }"
Yöntem B) çoklu olay işleyicileri
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
Yöntem C): jQuery
$(element).click(handler);
1.3.x
// incelemek
var clickEvents = $(element).data("events").click;
jQuery.each(clickEvents, function(key, value) {
alert(value) // alerts "function() { alert('clicked!') }"
})
1.4.x (işleyiciyi bir nesnenin içinde saklar)
// incelemek
var clickEvents = $(element).data("events").click;
jQuery.each(clickEvents, function(key, handlerObj) {
alert(handlerObj.handler) // alerts "function() { alert('clicked!') }"
// ayrıca kullanılabilir: handlerObj.type, handlerObj.namespace
})
(Bkz. jQuery.fn.data
ve jQuery.data
)
Yöntem D): Prototip (dağınık)
$(element).observe('click', handler);
1.5.x
// incelemek
Event.observers.each(function(item) {
if(item[0] == element) {
alert(item[2]) // alerts "function() { alert('clicked!') }"
}
})
1.6 ila 1.6.0.3, dahil (burada çok zorlandım)
// inceleyin. "_eventId" < 1.6.0.3 içindir while
// "_prototypeEventID" 1.6.0.3'te tanıtıldı
var clickEvents = Event.cache[element._eventId || (element._prototypeEventID || [])[0]].click;
clickEvents.each(function(wrapper){
alert(wrapper.handler) // alerts "function() { alert('clicked!') }"
})
1.6.1 (biraz daha iyi)
// incelemek
var clickEvents = element.getStorage().get('prototype_event_registry').get('click');
clickEvents.each(function(wrapper){
alert(wrapper.handler) // alerts "function() { alert('clicked!') }"
})
Firebug]1'a sahipseniz, herhangi bir JavaScript skalerinin, dizisinin veya nesnesinin konsol günlüğüne güzel bir ağaç yazdırmak için console.dir(object or array)
kullanabilirsiniz.
Dene:
console.dir(clickEvents);
veya
console.dir(window);