jQuery click anywhere except specified area to hide DIV function

This article mainly introduces jQuery Related information hidden by clicking anywhere except the designated area. The code is simple and easy to understand, very good, and has the value of reference and learning jquery. Friends who are interested in jquery You can refer to this article

The specific code is as follows:

$('body').click(function(e) {
  var target = $(e.target);
  // 如果#overlay或者#btn下面还有子元素，可使用
  // !target.is('#btn *') && !target.is('#overlay *')
  if(!target.is('#btn') && !target.is('#overlay')) {
    if ( $('#overlay').is(':visible') ) { 
      $('#overlay').hide();                          
    }
  }
});

or

$('body').click(function(e) {
  if(e.target.id != 'btn' && e.target.id != 'overlay')
   if ( $('#overlay').is(':visible') ) {
     $('#overlay').hide();
   }
})

PS: Let’s look at a piece of code jquery. Click on other places except itself to hide

$("#test").click(function(e) { 
  e?e.stopPropagation():event.cancelBubble = true; 
}); 
$(document).click(function() { 
  $("#test").fadeOut(); 
<pre name="code" class="html">e?e.stopPropagation():event.cancelBubble = true;  为阻止冒泡事件

});

Summary

The above is the jQuery introduced by the editor to hide p by clicking anywhere except the specified area. I hope to be helpful! !

Related recommendations:

Jquery clicks the button to submit the form asynchronously and synchronously

jQuery clicks the input to move the cursor to the last or specified position

jQuery clicks on the input box to display the verification code image

The above is the detailed content of jQuery click anywhere except specified area to hide DIV function. For more information, please follow other related articles on the PHP Chinese website!