By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
457,864 Members | 1,285 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 457,864 IT Pros & Developers. It's quick & easy.

window.event.srcElement

P: n/a
I have this IE specific bit of code for finding the originating node:

var obj=window.event.srcElement;

How do I do that cross browser (Opera, NS, Safari...)? Is there a standard
DOM method?

I seem to recall NS worked something like this:

onmousedown=handleThat;

function handleThat(e){
e.target;
// but then I'd have to take the parent to get the same node as IE
}

Event handling makes my head spin!

Jeff
Jul 23 '05 #1
Share this Question
Share on Google+
5 Replies


P: n/a
Jeff Thies wrote:
I have this IE specific bit of code for finding the originating node:

var obj=window.event.srcElement;

How do I do that cross browser (Opera, NS, Safari...)? Is there a standard
DOM method?

I seem to recall NS worked something like this:

onmousedown=handleThat;

function handleThat(e){
e.target;
// but then I'd have to take the parent to get the same node as IE
}

Event handling makes my head spin!
Jeff


Looks like you've got a good memory, I think this page deals with it:

http://www.sitepoint.com/article/scr...y-javascript/3

// in a cross-browser fashion
if (window.event) {
target = window.event.srcElement;
} else if (e) {
target = e.target;
} else return;

Mike

Jul 23 '05 #2

P: n/a


Jeff Thies wrote:
I have this IE specific bit of code for finding the originating node:

var obj=window.event.srcElement;

How do I do that cross browser (Opera, NS, Safari...)? Is there a standard
DOM method?

I seem to recall NS worked something like this:

onmousedown=handleThat;

function handleThat(e){
e.target;
// but then I'd have to take the parent to get the same node as IE
}


Yes, Mozilla implements the W3C DOM Level 2 Events module and that
defines properties like event.target with the DOM being node based so
such a target node can be a text node and not necessarily an element
node as IE's window.event.srcElement. Then you need to find the element
node containing the target node by walking the parentNode hierarchy:

element.onmouseover = function (evt) {
var srcElement;
if (evt && evt.target) {
srcElement = evt.target;
while (srcElement.nodeType != 1) {
srcElement = srcElement.parentNode;
}
}
else if (window.event) {
srcElement = window.event.srcElement;
}
if (srcElement) {
...
}
}

I think Opera 7 implements the W3C DOM target property as well but also
tries to support IE's window.event and window.event.srcElement.
--

Martin Honnen
http://JavaScript.FAQTs.com/

Jul 23 '05 #3

P: n/a
On Mon, 19 Apr 2004 13:19:55 +0200, Martin Honnen <ma*******@yahoo.de>
wrote:


Jeff Thies wrote:
I have this IE specific bit of code for finding the originating node:

var obj=window.event.srcElement;

How do I do that cross browser (Opera, NS, Safari...)? Is there a
standard
DOM method?

I seem to recall NS worked something like this:

onmousedown=handleThat;

function handleThat(e){
e.target;
// but then I'd have to take the parent to get the same node as IE
}
Yes, Mozilla implements the W3C DOM Level 2 Events module and that
defines properties like event.target with the DOM being node based so
such a target node can be a text node and not necessarily an element
node as IE's window.event.srcElement. Then you need to find the element
node containing the target node by walking the parentNode hierarchy:


Though both Mozilla and Opera implement addEventListener() for text nodes,
they don't seem to honour their events (not thoroughly tested). If a
listener is placed on an ancestor of the text node, I find that the target
assigned is the text node's parent. This might have been intended to mimic
IE's behaviour. However, it would still be wise to check in case a more
conforming implementation exists.

[snipped code]

Depending what the OP is trying to accomplish, you might be able to avoid
the issue altogether by taking advantage of event bubbling. Consider

<p>Some text</p>

If the user clicked on "Some text", the target property of the event
object might refer to the text node that contained the text, whilst
srcElement will always refer to the paragraph element. If you wanted to
alter the paragraph, simply place a listener on it and use the this
operator to refer directly to the element. Similarly

<table>
<tr>
<td>Some text</td>

listeners placed on the cell, row, or containing table elements will all
receive events targeted at the text node, but the this operator will
always refer to the element that the listener was registered with[1].

I think the only reason to explicitly check the original target is to
filter events when a listener can be fired from multiple sources
(descendants).
I think Opera 7 implements the W3C DOM target property as well but also
tries to support IE's window.event and window.event.srcElement.


You're right; it does.

Mike
[1] Be aware that IE contains a bug where the this operator isn't set
correctly when a listener is fired after being added with attachEvent(). A
workaround is to avoid attachEvent() and detachEvent() altogether and use
the event properties. Another is to set the this operator yourself:

if(Function.prototype){
Function.prototype.evtCall=Function.prototype.call ?
function(o,p){return this.call(o,p);}:
function(o,p){var n='__eC';while(o[n]){n+=n;}
o[n]=this;var r=o[n](p);delete o[n];return r;};
}
function attachEvent(o,t,l){
if(o&&l&&o.attachEvent){
o.attachEvent(t,function(){return l.evtCall(o,event);});
}
}

Notice that listeners will be passed the event object automatically,
rather than having to obtain it during execution (optional).

--
Michael Winter
M.******@blueyonder.co.invalid (replace ".invalid" with ".uk" to reply)
Jul 23 '05 #4

P: n/a
"Jeff Thies" <no****@nospam.net> writes:
I have this IE specific bit of code for finding the originating node:

var obj=window.event.srcElement;

How do I do that cross browser (Opera, NS, Safari...)? Is there a standard
DOM method?
Yes.
First of all, you need the event. In standard compliant browsers, the
event object is not (necessarily) reachable through a global variable,
but is passed as the argument of the event handler function.

Then you can use the "target" property of the event.

What I ususally do is:
---
function somehandler(event) {
event = event || window.event; // IE sucks
var tgt = event.tgt || event.srcElement; // IE sucks
...
}
---
(Yes, I usually include the comments :)
I seem to recall NS worked something like this:

onmousedown=handleThat;

function handleThat(e){
e.target;
// but then I'd have to take the parent to get the same node as IE


No, it is the same node as IE's window.event.srcElement (except
perhaps during bubbling).

/L
--
Lasse Reichstein Nielsen - lr*@hotpop.com
DHTML Death Colors: <URL:http://www.infimum.dk/HTML/rasterTriangleDOM.html>
'Faith without judgement merely degrades the spirit divine.'
Jul 23 '05 #5

P: n/a


Michael Winter wrote:
On Mon, 19 Apr 2004 13:19:55 +0200, Martin Honnen <ma*******@yahoo.de>
wrote:


Jeff Thies wrote:
I have this IE specific bit of code for finding the originating node:

var obj=window.event.srcElement;

How do I do that cross browser (Opera, NS, Safari...)? Is there a
standard
DOM method?

I seem to recall NS worked something like this:

onmousedown=handleThat;

function handleThat(e){
e.target;
// but then I'd have to take the parent to get the same node as IE
}

Yes, Mozilla implements the W3C DOM Level 2 Events module and that
defines properties like event.target with the DOM being node based
so such a target node can be a text node and not necessarily an
element node as IE's window.event.srcElement. Then you need to find
the element node containing the target node by walking the parentNode
hierarchy:

Though both Mozilla and Opera implement addEventListener() for text
nodes, they don't seem to honour their events (not thoroughly tested).
If a listener is placed on an ancestor of the text node, I find that the
target assigned is the text node's parent. This might have been intended
to mimic IE's behaviour. However, it would still be wise to check in
case a more conforming implementation exists.


Actually Mozilla intially fired mouse events with text nodes as the
target in an attempt to implement the W3C DOM correctly (at least it was
described as such) however somewhere after Mozilla 1.0 a Mozilla
developer considering text nodes as target to be akward changed the
event handling code and managed to get the changes into the Mozilla
(with Mozilla 1.3 or 1.4) so now you have to live with different
versions having different event target nodes.
The text node is still reported as the explicitOriginalTarget:

<html>
<head>
<title>event.target/event.originalTarget</title>
<script type="text/javascript">
function setEventListener () {
var p;
if (document.getElementById) {
p = document.getElementById('aP');
if (p && p.addEventListener) {
p.addEventListener('click',
function (evt) {
alert(evt.type + ' on ' + evt.target + ' with
explicitOriginalTarget ' + evt.explicitOriginalTarget);
},
false
);
}
}
}

window.onload = function (evt) {
setEventListener();
};
</script>
</head>
<body>
<p id="aP">
Kibology for all. Click for test.
</p>
</body>
</html>
--

Martin Honnen
http://JavaScript.FAQTs.com/

Jul 23 '05 #6

This discussion thread is closed

Replies have been disabled for this discussion.