Linked Questions

35 votes
5 answers
68k views

How to stop events bubbling in jQuery? [duplicate]

How do I stop custom event bubbling in jQuery? For example I have this code: $('.myclass').bind('amodaldestroy', function(){ ....does something..... }) How do I only allow this to be triggered ...
Stann's user avatar
  • 13.7k
20 votes
8 answers
16k views

Apply click method to outer div but not inner div [duplicate]

In this example I want the alert to be triggered when the black outer div is clicked but not when anything inside the inner div is clicked. Currently when I click the inner button it triggers the ...
Guerrilla's user avatar
  • 14.1k
2 votes
3 answers
3k views

Stop other onclick events [duplicate]

If two onclick are on top of each other, i would like to know how to stop the second one from launching. Example : <div id="div1" onclick="alert('a');"> a <div id="div2" onclick="alert('b');...
bob dylan's user avatar
  • 1,069
3 votes
1 answer
6k views

How do I prevent the onClick of the parent going off when clicking the child? [duplicate]

I have this component code: const myCardItem = ({ item }) => { function clickItem(){ alert('Item clicked'); } function clickMe(){ alert('Button clicked'); } ...
Spikee's user avatar
  • 4,280
1 vote
4 answers
2k views

How can I prevent click event from parent DOM? [duplicate]

say, I have HTML: <div onclick="parent()"> <div onclick="child()"></div> </div> SCRIPT: { function parent() { console.log("I'm your father"); } function child() { ...
kispi's user avatar
  • 185
5 votes
4 answers
292 views

Neglect a function in JavaScript? [duplicate]

When I click mainDiv, the function mainDiv() will be invoked, when I click subDiv, both mainDiv() and subDiv() functions are invoked. I want to invoke only the subDiv() function when I click subDiv. ...
shihabudheen's user avatar
2 votes
3 answers
2k views

How to Deativate parent element click event if child anchor tag is clicked? [duplicate]

I have a situation in which I am creating dynamic content from my database. In which I am creating <div> with content in it. And I have added onclick event that <div>. If user click on the ...
WarLock's user avatar
  • 58
2 votes
2 answers
822 views

jQuery on click on dynamically added class [duplicate]

I want to add a class to a button when clicking first time, and when clicking again on the newly added class, it should do something (for example show an alert). I'm trying this, but this shows the ...
sam's user avatar
  • 1,067
0 votes
1 answer
1k views

How can I click an element positioned over another element without triggering both click events? [duplicate]

JSFiddle example Is there a way to trigger the click event of a div inside another div without triggering the div on the containing elements click event? <style> #div1 { background-color: ...
Jordan's user avatar
  • 158
1 vote
2 answers
389 views

Return a specific DOM element from 'click' event handler [duplicate]

I have the following function: function viewdwable(dwableid) { $("#modal-body2").html('Temporary loading message..'); $("#myModal").fadeIn(300); $.ajax({ url: 'scripts/viewdwablehome.php', ...
Ben's user avatar
  • 369
0 votes
1 answer
300 views

div calling two different functions [duplicate]

I have two different divs that they call different functions when you click on them. The div that has the class="msg1" calls a function called message1() that brings one alert saying('this ...
Denis Ximenes's user avatar
1 vote
1 answer
151 views

How to stop javascript bubbling of events? [duplicate]

In my html code, I have a td tag that has an onclick event, and inside the td tag is an image tag that also has an onclick event. The problem is when I click the image, both its onclick and the td tag'...
omega's user avatar
  • 42.3k
-1 votes
1 answer
159 views

Preventing parent div click-event handler from triggering when clicking child element [duplicate]

Most probably this issue is well-documented, but I wasn't able to find an answer easily. I have click-event handlers for a div and a child-element embedded. And the problem is that when I click the ...
Edgar Navasardyan's user avatar
0 votes
1 answer
69 views

How to stop firing parent click event when child event clicked [duplicate]

I have this structure of divs and I want to prevent parent click event from triggering when the child element is clicked. <div onclick='methods(param)'> <div></div> &...
pl-jay's user avatar
  • 1,052
-2 votes
3 answers
107 views

Jquery: How is the simple way to click don't work in child elements? [duplicate]

Click on "child" also make the alert work. But what's the simple way to make click don't work on child elements? Here is an example: https://fiddle.jshell.net/k8t5dpg2/ Html <div id="secondary"&...
R. S's user avatar
  • 19
-2 votes
1 answer
34 views

Possible to ovveride javascript events? [duplicate]

I am wondering if it's possible to have a click event in javascript on both the table row and the icon column without the tr event happening instead. The table looks like this atm <table id="...
user2968166's user avatar
0 votes
0 answers
23 views

How can I add a button with onclick event to a list item that already has an onclick event? [duplicate]

I have a list item that already has an onclick event: const li = document.createElement("li"); li.textContent = list.title; li.addEventListener("click", ...
Elias's user avatar
  • 13
0 votes
0 answers
19 views

How to treat child element as separate from it's parent in html [duplicate]

Suppose i have a div tag with id "childDv" and it's parent div with id "parentDv". On clicking ChildDv i have some function call and on click of ParentDv i have some other function call. The problem ...
Praveen Patel G's user avatar
0 votes
0 answers
17 views

JavaScript - event owerriten by outer class element [duplicate]

I am sending two events here one when clicking on the specific div to mark the start of using form elements and the second for a specific input field inside the div. When the inner div is clicked, it ...
Filip Stojanovic's user avatar
0 votes
0 answers
11 views

click event listener on javascript [duplicate]

I have a problem that i cannot resolve. I'm adding a click event listener to a parent container and also to its child. I need to take the info of both clicks but the problem is when the child ...
tobi's user avatar
  • 47
25 votes
8 answers
127k views

Close a div by clicking outside

I want to hide a div by clicking on the close link in it, or by clicking anywhere outside that div. I am trying following code, it opens and close the div by clicking close link properly, but if I ...
user1355300's user avatar
  • 4,937
35 votes
7 answers
45k views

How do you force your Javascript event to run first, regardless of the order in which the events were added?

I have Javascript that people are including in their page. In my Javascript I have a version of jQuery (1.8 for sake of easy reference) that is sectioned off into its own namespace, and referenced ...
Scott's user avatar
  • 1,022
22 votes
5 answers
34k views

No onclick when child is clicked

I have the following html code: <div class="outerElement"> <div class="text"> Lorem ipsum dolar sit amet </div> <div class="attachment"> <!-- Image ...
xorinzor's user avatar
  • 6,316
14 votes
2 answers
13k views

difference between true and false in javascript eventlistener

i have a doubt in eventlistener concept.What is the difference between bellow two codes i have doubt in the true/false section.no change happens when i replace the 1st code with the second code in my ...
DjangoDev's user avatar
  • 927
7 votes
6 answers
15k views

Detect background click in jQuery

Say I have the following HTML: <div> <span>span text</span> div text <span>some more text</span> </div> I want to make it so that when I click on span, it will ...
Senseful's user avatar
  • 89.4k
5 votes
3 answers
8k views

trigger event only on parent click not child

Consider the following code as an example: <div id="parent"> <div id="child">info goes here</div> </div> //javascript function something{ //do something;} //initial attempt ...
Paul Carlson's user avatar
3 votes
6 answers
10k views

Prevent redirect when clicking on anchors child element

I have a button that's located in an anchor, and that button has some logic that's triggerd by clicking on it. The problem is that whenever I click on that button, the app get's redirected due the ...
Vucko's user avatar
  • 20.8k
7 votes
2 answers
3k views

Ignore parent onclick when child onclick is clicked, using Javascript only

An good example of what im trying to do is, think of instragram. When you are click on a photo, it opens a window with that photo plus the grey background. If you click anywhere in the grey background ...
user avatar
2 votes
4 answers
3k views

stopPropagation & preventDefault are not working, parent click is still firing

In my code, I have added onclick on parent div and want to perform other action on inner div, but clicking on inner div also triggering parent click. how to stop that? $(document).on('click', '....
Jitendra Pancholi's user avatar
3 votes
9 answers
828 views

How to control click event of <li> conditionally?

I have a ul tag and several li tags inside that. When I click on a li some action is occurs using Jquery click event. For each li the action is different. Then I added a text box into each li. When ...
user avatar
0 votes
1 answer
2k views

How to make href listen stopPropagation [duplicate]

stopPropagation works but cannot stop href being executed on child click, is there a way to make parent anchor do not execute it's href on child element is clicked(stopPropagation/bubbling)? Here is ...
Syed's user avatar
  • 16.1k
0 votes
5 answers
848 views

Div to toggle it's display on/off but be able to click the input

I'm trying to make it so that whenever you click on either the button OR div itself, the display toggles. But whenever I click on the input inside of the div, the div disappears. How can this be made ...
user8758206's user avatar
  • 2,133
2 votes
2 answers
1k views

How to have a different onClick event for the child element without affecting the parent one?

Having the following structure: <div class="the-parent"> <div> <a onClick="doParentStuff()"> <div> <i onClick="doChildStuff()&...
Leo Messi's user avatar
  • 5,776
3 votes
1 answer
1k views

How to add a marker and show a div relative to a mouse click in vanilla Javascript

I'm trying to add a marker and a div next to the mouse click in vanilla Javascript. Basically if the user clicks anywhere on the page, I want to add a marker where the click was made (a circular small ...
AziCode's user avatar
  • 2,590
1 vote
2 answers
2k views

React event handling together with plain JS

I have a situation when I have to render React controls in some code that I do not control. It's a kendo UI grid and I need to render custom React component in the grid cells. Grid is created using ...
Oleksandr Taran's user avatar
0 votes
5 answers
197 views

click event replication [duplicate]

I have this structure <div> <ul> <li>...</li> <li.... ... </ul> </div> and in Jquery $(div).click(function(){...}); $(li)....
kirankumar's user avatar
0 votes
2 answers
2k views

How to prevent click of parent div when child is clicked

I have a div with an <a href> inside it. When the div is clicked I want to show a popup but when the anchor is clicked, I want to show a different modal. <div data-toggle="modal" data-...
Le guy's user avatar
  • 59
-1 votes
1 answer
573 views

Can't use nested anchor

Ok. I've got the following script: $('#exhibitions .item.plain').toggle( function() { $(this).css({ 'height': '302px', 'z-index': '10', 'background': '#...
lexeme's user avatar
  • 2,965
0 votes
3 answers
677 views

How to select and toggle element inside the div in javascript

I need to toggle an icon inside the div element. The main issue for me is that toggling will happen everytime an user clicks on the div, not on the icon. HTML <div class="faq__questions-...
marion moseby's user avatar
0 votes
1 answer
775 views

How to get a parent's event to not trigger when clicking on child elements, but not prevent child element events

After reading a couple of posts like this one, I'm trying to discover a way to be able to click on the parent div to hide itself, but not hide when clicking on either the search box or the 'click for ...
user8758206's user avatar
  • 2,133
1 vote
3 answers
823 views

Prevent clicking element with ng-click from triggering anchor tag

I have a <span> with a ng-click handler inside of an <a> tag. <a href="/foo/bar"> <h1>Some title</h1> <span ng-click="doSomething()">Say Hi!</span> </...
Don P's user avatar
  • 62k
0 votes
2 answers
820 views

Loading an Iframe src with selection from horizontal drop down menu

I am a new member to this site...have used it for a long time but never a member but i have not been able to find an answer so I thought I should ask. I am new to working with jquery and html ...
RisingSon's user avatar
0 votes
1 answer
290 views

Nested element with events [duplicate]

I have an element that looks like this, <div class='outer'> <div class='inner'></div> </div> I have 2 events on this DOM elements, $('.outer').click(function(e){ ...
Udders's user avatar
  • 6,926
0 votes
3 answers
575 views

When clicking on the child don't consider the parent

I want some method to convince CSS that when I click on one of the children inside the parent element don't consider that I clicked also on the parent element. I want you to try clicking on one of the ...
Kyle Tech's user avatar
0 votes
0 answers
701 views

Make a button inside of container clickable first rather then container

In a Chrome extension, I am gathering all images in a list. Then I add a button on top of every image, that is done for every webpage. On some websites, images are sitting inside of the container ...
Adam's user avatar
  • 149
0 votes
1 answer
696 views

Are nested anchors within a routerLink possible?

I'm trying to put some anchors (<a> elements) within a larger clickable element (also <a>), which is a routerLink. A simplified layout: <div> <a [routerLink]="['/details', ...
Dasha's user avatar
  • 756
0 votes
5 answers
506 views

how to not fire its children when parent is clicked? (vanilla javascript)

[Final Edit: I feel compel to response as I learned a LOT from this post(mainly through you guys, and I spend more time understanding CSS.. but at the end, I really don't have any good idea how to ...
user3502374's user avatar
0 votes
2 answers
623 views

Event listener and button click conflict

I have a menu that needs to obey the following behavior: Open with an external button press Close when there is a click outside it's boundaries The problem is, that the button to open is also ...
klaytonme's user avatar
1 vote
4 answers
595 views

select multiple tr and redirect on single tr click

I have a table. This is the sample code for it. <table> <thead> <tr> <td>filename</td> <td>file size</td> <td>date</td> </tr> &...
Sandesh Ghanta's user avatar
0 votes
0 answers
577 views

The link inside a clickable div(div has link) does not work

I am working with React.js and I have a clickable 'main' div(the div with the onClick function at top) and I have an other link inside this div, and some clickable elements inside the div( the ...
hidde 's user avatar

15 30 50 per page