Note that there are some explanatory texts on larger screens.

plurals
  1. POCan I stop event propagation on certain function?
    primarykey
    data
    text
    <p>I have some DIVs, and other developer bind them a click event name <code>fn_propagation</code>.</p> <p>And now I want to add a new function to them name <code>fn_stoppropagation</code>.</p> <p>The problem is when I call <code>e.stopPropagation()</code> in <code>fn_stoppropagation</code>, it will stop event propagation in <code>fn_propagation</code> too. </p> <p>How can I keep event propagation in <code>fn_propagation</code> but stop propagation in my added function? ( I know add event to each DIV by ID and stop use stopPropagation() can do this, but i don't think it's a good way. )</p> <p>fiddle : <a href="http://jsfiddle.net/android/3GurB/2/" rel="nofollow">http://jsfiddle.net/android/3GurB/2/</a></p> <p>HTML:</p> <pre><code>&lt;div id='div1'&gt; &lt;div id='div2'&gt; &lt;div id='div3'&gt; Click Me &lt;/div&gt; &lt;/div&gt; &lt;/div&gt; </code></pre> <p>JS:</p> <pre><code>$('div').click(fn_propagation) // Other developer add this event .click(fn_stoppropagation); // What I going to add. // I want to keep propagation of this function function fn_propagation(){ alert('propagation '+$(this).attr('id')+' called'); $(this).toggleClass('green'); } // But stop propagation of this function function fn_stoppropagation(e){ alert('stoppropagation '+$(this).attr('id')+' called'); e.stopPropagation(); } </code></pre> <p>When <code>Click Me</code> is clicked, expect output:</p> <pre><code> propagation div3 called // called stoppropagation div3 called // called propagation div2 called // expected, but NOT called, propagation div1 called // expected, but NOT called, </code></pre> <p>Thank you.</p>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload