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进行举报,并提供相关证据,查实之后,将立刻删除涉嫌侵权内容。
长按识别二维码并关注微信
更方便到期提醒、手机管理