Prevent javascript execution

Question

<div onclick="AutogeneratedMethod()">
<span>SPAN 1 : I require auto method </span>
<span onclick="DesiredMethod()">SPAN 2 : I do not require auto method</span>
</div>

In the above code sample, how do I prevent calling the AutogeneratedMethod() when the user clicks on the SPAN 2? I do not have any control on the declaration of the div and its respective onclick behavior. That line is auto-generated from the framework I am using.

I'm looking for something that would kill Javascript execution at the end of the DesiredMethod(). Something like this:

function DesiredMethod() {
//Do necessary stuff
exit; //Abort any further Javascript
}

• ajax333221: execute invalid code, it will totally prevent any further JavaScript :)
• Blazemonger: Is there any jQuery somewhere else in your code?

Answer 1

You want to stop event propagation. IE has cancelBubble.

Answer 2

You could also just move things around a bit like this:

<div>
 <span onclick="AutogeneratedMethod()">SPAN 1 : I require auto method </span>
 <span onclick="DesiredMethod()">SPAN 2 : I do not require auto method</span>
</div>

Then you wouldn't need to worry about event propagation and bubbling.

You may also want to consider attaching your JavaScript events via a different mechanism either with a framework(jQuery, etc...) or with pure JavaScript. Doing it via HTML attributes is frowned upon for many reasons. Check out this link for more details.

• brayne: It is not under my control. The div & its onclick I mentioned here is generated by JSF.