call function on click outside of a particular div

html, javascript, jquery

Solution

You can achieve it by the following code (demo : http://jsfiddle.net/CrfCD/)

$(document).ready(function(){
    $(document).click(function(e){
        if ($(e.target).is('#test,#test *')) {
            return;
        }
        else
        {
            alert("Hi");
            //Perform your event operations
        }
    });
});

Problem

I am having a html structure as ``` <div class="abc"> <div id="test"> <label>Name</label> <input type="checkbox"> <label>Name</label> <input type="checkbox"> <label>Name</label> <input type="checkbox"> </div> </div> ``` I want that when i click outside of div id test, a particular function can be called. and also no event shall be triggered when inside the div id test i.e when I click the checkboxes, no event shall be triggered. Any help will be really appreciated.

Original source