Jquery: how to hide the drop-down div and mask layer when clicking other regions _ jquery-js tutorial

This article mainly introduces jquery's method of hiding the drop-down div and mask layer when clicking other areas, and involves jQuery's function of responding to mouse events to dynamically change the page element style, for more information about how to hide the drop-down p and mask layers when you click other areas in jquery, see the examples in this article. We will share this with you for your reference. The details are as follows:

For better user experience, when you pull down to obtain other pop-up layers, When you expand the drop-down, you need to click other areas to automatically hide the drop-down and mask layers, this effect can be achieved using a piece of js.

For example, a drop-down menu is for reference:

Result implementation source code:

$ (Document ). bind ('click', function (e) {var e = e | window. event; // browser compatibility var elem = e.tar get | e. srcElement; while (elem) {// cyclically judge to the following node to prevent clicking the p subelement if (elem. id & elem. id = 'menu ') {return;} elem = elem. parentNode;} // click not p or its child element $ ('. menuList ,. overlay '). hide ();});

I hope this article will help you with jQuery programming.