Home > Article > Web Front-end > How to hide div elements by clicking on other elements in jquery
Implementation steps: 1. Use the ":not()" selector and click() function to bind click events to other elements other than div, and set the processing function, the syntax is "$(":not ('div')").click(function() {//The code executed after the click event occurs});"; 2. In the processing function, use the hide() function to hide the div element, the syntax "$(" div").hide();".
The operating environment of this tutorial: windows7 system, jquery3.6.1 version, Dell G3 computer.
In jquery, you can use the :not() selector, click() and hide() methods to hide div elements by clicking on other elements.
Implementation steps:
Step 1: Use: not() selector and click() function to bind clicks to other elements other than div event, and set the processing function
$(":not('div')").click(function() { //点击事件发生后,执行的代码 });
In the event processing function, the code written is the effect code achieved after clicking
Step 2: In the processing function, Use the hide() function to hide div elements
$("div").hide();
Sample code:
<script> $(document).ready(function() { $(":not('div')").click(function() { $("div").hide(); }); }); </script>需要隐藏的div元素p元素
p元素
span需要隐藏的div元素
Instructions:
:not() selector selects all elements except the specified element.
The most common usage: used with other selectors to select all elements in the specified combination except the specified element.
$(":not(selector)")
Parameter | Description |
---|---|
selector | Required. Specifies elements that are not selected. This parameter accepts any type of selector. |
[Recommended learning: jQuery video tutorial, web front-end video】
The above is the detailed content of How to hide div elements by clicking on other elements in jquery. For more information, please follow other related articles on the PHP Chinese website!