Path: csiph.com!x330-a1.tempe.blueboxinc.net!usenet.pasdenom.info!weretis.net!feeder4.news.weretis.net!ecngs!feeder2.ecngs.de!newsfeeder.ewetel.de!multikabel.net!newsfeed20.multikabel.net!eweka.nl!lightspeed.eweka.nl!npeer.de.kpn-eurorings.net!npeer-ng0.de.kpn-eurorings.net!newsfeed.arcor.de!newsspool3.arcor-online.net!news.arcor.de.POSTED!not-for-mail
Content-Type: text/plain; charset="UTF-8"
Message-ID: <1834269.dtTrMRavdF@PointedEars.de>
From: Thomas 'PointedEars' Lahn <PointedEars@web.de>
Reply-To: Thomas 'PointedEars' Lahn <cljs@PointedEars.de>
Organization: PointedEars Software (PES)
Date: Fri, 25 Nov 2011 17:58 +0100
User-Agent: KNode/4.4.11
Content-Transfer-Encoding: 8Bit
Subject: Re: <ul><li><ul><li>... onclick() only for one node ?
Newsgroups: comp.lang.javascript
References: <9j9pfhFe3lU1@mid.individual.net>
Followup-To: comp.lang.javascript
MIME-Version: 1.0
Lines: 37
NNTP-Posting-Date: 25 Nov 2011 17:58:01 CET
NNTP-Posting-Host: bfc08c44.newsspool3.arcor-online.net
X-Trace: DXC=L2ZkKNcI[JF@k=MdN::NBIMcF=Q^Z^V3H4Fo<]lROoRA8kF<OcfhCOKlR2`G9JAm;@DZm8W4\YJNLUFDj8T]K0?CDmniOZG;K0KWg7RFAA]FRK
X-Complaints-To: usenet-abuse@arcor.de
Xref: x330-a1.tempe.blueboxinc.net comp.lang.javascript:8636

Jörg Weule wrote:

> at <ul><li><ul><li>...</li></ul></li></ul> I got the click event on the
> whole tree and want to process the event for only on one node.
> 
> How can i stop the event processing calling my function for any node at
> the hirachie?

If this is really only for one node, you can call the stopPropagation() 
method (standards-compliant) or set the event object's `cancelBubble' 
property to `true' (MSHTML) in the event listener.  However, the drawback of 
this is that *no* element "upwards" in the tree will receive that event 
then, which may not be wanted.

If the latter is important, or if this instead for multiple nodes at the 
same nesting level, you should not do this.  For then you need to stop event 
progagation at every child node.  This comparably inefficient approach is 
propagated by, e. g., jQuery and other selector-based libraries, where you 
would first select elements by a criterion (usually a `class' attribute 
value) and then add an event listener to each matching element.

It is therefore better (for bubbling events like `click') to add only one 
event listener to an ancestor element (here: the `ul' element) in which you 
compare the event target against the object the event has bubbled up to 
(e.target == this, or e.srcElement == this in MSHTML [do not use 
attachEvent()]), and only perform the action for relevant event targets.  In 
case of remaining ambiguity, you can use e. g. the event target's `class' 
attribute value as well.  Be aware that text nodes can be event targets, 
too.


PointedEars
-- 
Anyone who slaps a 'this page is best viewed with Browser X' label on
a Web page appears to be yearning for the bad old days, before the Web,
when you had very little chance of reading a document written on another
computer, another word processor, or another network. -- Tim Berners-Lee