title: YAHOO Event.stopEvent
body: <p>I am trying to prevent JavaScript events from continuing to propagate, using YUI.  The following is some minimal HTML and some minimal JavaScript which demonstrates the problem:</p>
  <p>HTML:</p>
  <pre><code>&lt;a href=&quot;#foo&quot; onClick=&quot;fooClickTest()&quot; id=&quot;foo&quot;&gt;foo&lt;/a&gt;&amp;nbsp;
  &lt;a href=&quot;#bar&quot; id=&quot;bar&quot;&gt;bar&lt;/a&gt;&amp;nbsp;
  </code></pre>
  <p>JavaScript:</p>
  <pre><code>function fooClickTest(e) {
      alert('fooClickTest');
      YAHOO.util.Event.addListener('bar', 'click', barClickTest1);
      YAHOO.util.Event.addListener('bar', 'click', barClickTest2);
      YAHOO.util.Event.addListener('bar', 'click', barClickTest3);
      YAHOO.util.Event.preventDefault(e);
  }
  
  function barClickTest1(e) {
      alert('barClickTest1');
      YAHOO.util.Event.preventDefault(e);
  }
  
  function barClickTest2(e) {
      alert('barClickTest2');
      YAHOO.util.Event.preventDefault(e);
      YAHOO.util.Event.stopEvent(e);
  // Also tried:
  //  YAHOO.util.Event.stopPropagation(e);
  // and:
  //        if (e.stopPropagation) {
  //            e.stopPropagation();
  //        } else {
  //            e.cancelBubble = true;
  //        }
  }
  </code></pre>
  <p>What I expect to happen is that the user can click on <code>foo</code> to add the three-click handlers, and then click on <code>bar</code>.  Then, the user will see TWO alerts, <code>barClickTest1</code> and <code>barClickTest2</code>.  Instead, all three alerts occur.  The <code>YAHOO.util.Event.stopEvent(e)</code> does not do what I expect, which is to stop the event propagating out to <code>barClickTest3</code>.</p>
  <p>I have tested my code in Firefox 3.0.7 and in Safari 3.2.1.  As you can see above, I have also tried <code>YAHOO.util.Event.stopPropagation(e)</code> and <code>e.stopPropagation()</code>.  None of them did the trick.</p>
  <p>This is obviously a contrived example, though it does demonstrate the problem.  In the real solution, I will only prevent event propagation if some conditions are met.</p>
  <p>Is my understanding of JavaScript's events simply messed up?  How do I accomplish my goals?</p>