jQuery怎样实现任意点击隐藏div的效果?我们一些网站经常能看到通过点击任意位置后关闭打开div的效果,这样的好处是能提高用户的体验,那么具体怎样实现这一效果呢?

本教程操作环境:windows10系统、jquery3.2.1版本、Dell G3电脑。
jquery怎样点击任何地方隐藏div
在jquery中可以利用hide()方法和click()方法实现点击任何地方隐藏div效果。
click()方法当点击元素时,会发生 click 事件。当鼠标指针停留在元素上方,然后按下并松开鼠标左键时,就会发生一次 click。click() 方法触发 click 事件,或规定当发生 click 事件时运行的函数。
示例如下:
<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>输出结果:

以上就是用jQuery实现任意点击隐藏div的效果的方法介绍,上述示例具有一定的借鉴价值,有需要的朋友可以了解看看,希望对大家学习jQuery的使用有帮助,想要了解更多可以继续浏览群英网络其他相关的文章。
文本转载自PHP中文网
免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:mmqy2019@163.com进行举报,并提供相关证据,查实之后,将立刻删除涉嫌侵权内容。
长按识别二维码并关注微信
更方便到期提醒、手机管理