Created
October 15, 2008 13:44
-
-
Save subtleGradient/16903 to your computer and use it in GitHub Desktop.
Event Delegation by Stedia and the MooTools Dev Team
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// basic usage: | |
$('myParentElement').relayEvents({ | |
'a.menuitem':{ | |
'click': function(e){} | |
}, | |
'input[name=phone]':{ | |
'keydown': function(e){}, | |
'keypress': function(e){} | |
} | |
}); |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/* | |
Event Delegation - really powerfull, if you can understant why :-) | |
License: MIT-style license. | |
Copyright: Copyright (c) 2008 Daniel Steigerwald, daniel.steigerwald.cz | |
Example: http://daniel.steigerwald.cz/demos/delegated/default.htm | |
*/ | |
(function(){ | |
function check(e, selector, fn){ | |
var target = e.target, | |
els = this.getElements(selector), | |
isOverOut = /^(mouseover|mouseout)$/.test(e.type); | |
for (var i = els.length; i--; ){ | |
var el = els[i]; | |
if (el == target || el.hasChild(target)){ | |
if (isOverOut && !checkOverOut.call(el, e)) return; | |
fn.call(el, e, el); | |
return; | |
} | |
} | |
} | |
function checkOverOut(e){ | |
var related = e.relatedTarget; | |
return related == undefined | |
|| related !== false | |
&& $type(this) != 'document' | |
&& related != this | |
&& related.prefix != 'xul' | |
&& !this.hasChild(related); | |
} | |
Element.Properties.relayedEvents = { | |
set: function(obj){ | |
this.relayEvents(obj); | |
} | |
}; | |
Element.implement({ | |
relayEvent: function(selector, type, fn){ | |
type = { mouseenter: 'mouseover', mouseleave: 'mouseout'}[type] || type; | |
var revents = this.retrieve('$moo:revents'); | |
if (!revents) this.store('$moo:revents', revents = {}); | |
var sel = revents[selector] = revents[selector] || {}; | |
sel[type] = sel[type] || []; | |
var fn = check.bindWithEvent(this, [selector, fn]); | |
sel[type].push(fn); | |
return this.addEvent(type, fn); | |
}, | |
relayEvents: function(selector, events){ | |
if (/^(hash|object)$/.test($type(selector))) | |
for (var sel in selector) this.relayEvents(sel, selector[sel]); | |
else | |
for (var type in events) this.relayEvent(selector, type, events[type]); | |
return this; | |
}, | |
unrelayEvents: function(selector){ | |
var events = this.retrieve('$moo:revents'); | |
if (events && events[selector]){ | |
for (var type in events[selector]){ | |
events[selector][type].each(function(fn){ | |
this.removeEvent(type, fn); | |
}, this); | |
} | |
} | |
return this; | |
} | |
}); | |
})(); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment