Child element being passed to handler?

[Jon]

I have something like this on my page :
<div id="container">
<h1 id="innertext">HELLO!</h1>
</div>

and this event-selector rule:

'#container:mouseover' : function(element) {
new Insertion.After($('container'), "Mouse over "+element.id+"<br/>")
}

I would expect the element that gets passed into that function to
always be $('container'), but it's not - I usually get the child
element ( $('innertext') )

Is there any way of getting the element that the rule was originally
applied to?

[Sam]

Here's a modification I made to Event Selectors that solves this problem:

Change:

observer = function(event) {
var element = Event.element(event);
if (element.nodeType == 3) // Safari Bug (Fixed in Webkit)
element = element.parentNode;
rule.value($(element), event);
}

To:

observer = function(event) {
var eventElement = Event.element(event);
if (eventElement.nodeType == 3) // Safari Bug (Fixed in
Webkit)
eventElement = eventElement.parentNode;
rule.value($(element), event, element);
}

This change adds an optional 3rd parameter "element" which will always be
the element selected by your selector.

Sam

[Sam]

My mistake. The last line should be

rule.value($(eventElement), event, element);

Sam

[SCREECH]

SAM,

thank you ...
you saved my day...

please put this into the normal event:selectors release...
otherwise it is not useable for complex web design...

best regards,
Screech

[Jeff]

Simply commenting out the line

var element = Event.element(event);

worked great for me. It doesn't appear that it's necessary.

[Ben Schwarz]

This also worked for me.
I haven't checked cross browser yet - I'll post any issues I find.