Home > Article > Web Front-end > How to hide div by clicking anywhere in jquery
How to hide div by clicking anywhere in jquery
- WBOYOriginal
- 2021-12-13 17:46:322169browse
Method: 1. Bind the click event to the body element and specify the event processing function. The syntax is "$("body").click(function())"; 2. In the event processing function, use The hide() method implements the effect of hiding the div by clicking anywhere, and the syntax is "$("div").hide();".
The operating environment of this tutorial: windows10 system, jquery3.2.1 version, Dell G3 computer.
How to hide div by clicking anywhere in jquery
In jquery, you can use the hide() method and click() method to hide the div by clicking anywhere div effect.
click() method When an element is clicked, the click event occurs. A click occurs when the mouse pointer is over an element and the left mouse button is pressed and released. The click() method triggers a click event, or specifies a function to run when a click event occurs.
The example is as follows:
<html>
<head>
<script type="text/javascript" src="/jquery/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("body").click(function(){
$("div").hide();
});
});
</script>
<style type="text/css">
div{
width:200px;
height:200px;
background-color:red;
}
</style>
</head>
<body>
<div></div>
</body>
</html>Output result:
Related video tutorial recommendation: jQuery video tutorial
The above is the detailed content of How to hide div by clicking anywhere in jquery. For more information, please follow other related articles on the PHP Chinese website!