Question

I have div having class name “.modalPopup” inside the div I have multiple table and inside table I have divs and inside the multiple controls like text box(input) and dropdownlists(select).

I want is that I want to fire click event when user click on any where on main div which have “modalPopup ” except the dropdownlist(select).
I try using my options but I can’t get the specific click event.
Like this:

  $('.modalPopup :not(modalPopup select)').click(function(){
    document.write("working for click except select ");
    });

Can any one please provide me the solution?

Answer 1

Easiest way is to just bind the click event on the div with class of modalPopup and then check what the user actually clicked on using e.target:

$('.modalPopup').click(function(e){
    if (!$(e.target).is('select')) {
        document.write("working for click except select ");
    }
});

e.target is the dom element that was clicked. $(e.target).is('select') gets that dom element and created a jQuery object from it and checks if it is a select.

JSFiddle Example