A simple example of jQuery clicking somewhere other than itself to close the popup layer_jquery

The main function is to click to display, and then click anywhere on the page to turn off the display effect, mainly the function of $(document).click

There are often some pop-up layers during the development process. After pop-up, they should be automatically closed when clicking elsewhere on the page. The following is the implementation code:

HTML code:

Copy code The code is as follows:

click

show-area

CSS code ：
.hide{display:none;}

JS code

Copy code The code is as follows:

$ (document).ready(function(){
$("div.down").click(function(e){
e.stopPropagation();
$("div.con"). removeClass("hide");
});
$(document).click(function(){
if(!$("div.con").hasClass("hide")){
$("div.con").addClass("hide");
}
});
});

OK, test it locally Well, modify the css style yourself!