CODEWITHSUNDEEP
javascriptmouseevent
user353885
user353885

Reputation: 650

How to make mouse events only apply to outer DIV?

How do I make this work:

<div onclick="alert('You clicked me!')" style="background:lightblue;display:inline-block;padding:20px">
    <textarea rows="5" cols="50">You can click and select text here normally, but I don't register mouse events from the DIV behind me!</textarea>
    <div id="inner" style="background:lightgreen">Same here. I want my own mouse events - not the ones from #inner.</div>
</div>

Thank you!

Upvotes: 2

Views: 856

Answers (1)

Šime Vidas
Šime Vidas

Reputation: 186063

I'm guessing you want this:

<div onclick="if (event.target === this) alert('You clicked me!')">

Live demo: http://jsfiddle.net/UZtag/1/

So, the alert does not pop up if the TEXTAREA or #inner DIV is clicked, but only if the outer DIV is clicked directly.

Upvotes: 3

Related Questions