How to stop event propagation with inline onclick attribute?

0 votes

Consider the following:

<div onclick="alert('you clicked the header')" class="header">
  <span onclick="alert('you clicked inside the header');">something inside the header</span>
</div>

How can I make it so that when the user clicks the span, it does not fire the div's click event?

Sep 23 in Java-Script by kartik
• 30,630 points
34 views

1 answer to this question.

0 votes

Hello @kartik,

Use event.stopPropagation().

<span onclick="event.stopPropagation(); alert('you clicked inside the header');">something inside the header</span>

For IE: window.event.cancelBubble = true

<span onclick="window.event.cancelBubble = true; alert('you clicked inside the header');">something inside the header</span>
Hope it helps!!
Thank you!!
answered Sep 23 by Niroj
• 66,420 points

Related Questions In Java-Script

0 votes
1 answer

How to call jQuery UI Dialog with ASP.NET button postback?

Hello @kartik, To solve the problem with ASP:Button ...READ MORE

answered Apr 28 in Java-Script by Niroj
• 66,420 points
445 views
0 votes
1 answer

How to use React Router with Laravel?

Hii Kartik, Create a route that maps everything ...READ MORE

answered Apr 29 in Java-Script by Niroj
• 66,420 points
1,332 views
0 votes
1 answer

How to find event listeners on a DOM node when debugging or from the JavaScript code?

Hii @kartik, It is possible to list all ...READ MORE

answered Jun 8 in Java-Script by Niroj
• 66,420 points
625 views
0 votes
1 answer

How to Store PHP variable with HTML in JavaScript in Laravel Blade Template?

Hello @kartik, The double curly brackets {{ }} will always ...READ MORE

answered Jun 11 in Java-Script by Niroj
• 66,420 points
2,568 views
0 votes
1 answer

jQuery AJAX fires error callback on window unload - how do I filter out unload and only catch real errors?

Hello, In the error callback or $.ajax you have three ...READ MORE

answered Apr 27 in Java-Script by Niroj
• 66,420 points
289 views
0 votes
1 answer

How do I pass command line arguments to a Node.js program?

Hello @kartik, If your script is called myScript.js ...READ MORE

answered May 5 in Java-Script by Niroj
• 66,420 points
469 views
0 votes
1 answer

Error:Issue when trying to use IN() in wordpress database

Hello @kartik, Try this code : // Create an ...READ MORE

answered May 8 in PHP by Niroj
• 66,420 points
78 views
+2 votes
1 answer

How do I debug Node.js applications?

Hello @kartik, Use node-inspector  from any browser supporting WebSocket. Breakpoints, ...READ MORE

answered Jul 8 in Node-js by Niroj
• 66,420 points
75 views
0 votes
1 answer

How can I send a message to a particular client with socket.io?

Hii, You can try the code below: io.to(socket.id).emit("event", data); whenever ...READ MORE

answered Apr 27 in Java-Script by Niroj
• 66,420 points
4,170 views
0 votes
1 answer

How to set outerHTML with jQuery?

hello @kartik, This is innterHTML because it's inside ...READ MORE

answered Apr 27 in Java-Script by Niroj
• 66,420 points
104 views