Geek Answers Handbook

Assign a jQuery click event to everything in the body, except for a few divs and their children

When I click the div on my page, a popup appears. When you press div again, the popup disappears. When you click outside the div, the popup disappears - everything looks good so far.

The problem is that when I click the popup, I want the popup and its children to be interactive (they are links inside an unordered list). But I can’t make it work. Here is my code

$(function () { $('#messageNotification').click(function (event) { $("body").one('click', function () { jQuery(".userInfo").fadeOut(); }); event.stopPropagation(); }); <body> <div id="messageNotification"><div class="notif same">0</div></div> <div id="messages"> <ul class="userInfo" style=""> <li></li> </ul> </div> </body>
+4
source share
1 answer

If I understand you correctly, you can filter by selector. For instance:

 $('body').on('click', 'a', function(){ ... });

This will bind the click event to all elements matching the selector a .

If you want to attach a click to all elements that do not match your popup, you can do something like:

 $('body').on('click', ':not(#popup)', function(){ // code to dismiss popup here });

See jquery documentation for : not () and . on () for more information ...

+7
source

More articles:


All Articles