专栏首页前端小叙点击除元素以外的任意地方隐藏元素js

点击除元素以外的任意地方隐藏元素js

比如想实现点击列表弹出筛选器,点击其他任意地方关闭筛选器,如图

该筛选器class名

 1  $(document).click(function () {
 2       $(".subMenu").hide();
 3 });
 4  $(".subMenu").on("click", function (event) {
 5       //取消事件冒泡
 6       var e = arguments.callee.caller.arguments[0] || event; //若省略此句,下面的e改为event,IE运行可以,但是其他浏览器就不兼容
 7       if (e && e.stopPropagation) {
 8           // this code is for Mozilla and Opera
 9           e.stopPropagation();
10       } else if (window.event) {
11           // this code is for IE
12           window.event.cancelBubble = true;
13       }
14 });

首先点击document任意位置隐藏该元素,然后给该元素绑定click事件,阻止冒泡到该元素,则可以顺利实现需求。

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • whistle手机调试工具使用简单教程

    启动之后,输入127.0.0.1:8899 就可以访问到whistle调试界面了:

    蓓蕾心晴
  • vue给input file绑定函数获取当前上传的对象

    HTML <input type="file" @change="tirggerFile($event)"> JS(vue-methods) tirgger...

    蓓蕾心晴
  • 移动端页面按手机屏幕分辨率自动缩放的js

    1 <script> 2 var phoneWidth = parseInt(window.screen.width); 3 var ph...

    蓓蕾心晴
  • ASP.NET Core Blazor Webassembly 之 渐进式应用(PWA)

    Blazor支持渐进式应用开发也就是PWA。使用PWA模式可以使得web应用有原生应用般的体验。

    kklldog
  • 深圳Java培训:游戏中寻找学习JAVA的乐趣

    本篇主要介绍RobocodeAPI中的各种事件函数的说明,便于使用函数时有更清晰的思路。

    深圳java培训技术
  • Sentence-BERT详解

    BERT和RoBERTa在文本语义相似度(Semantic Textual Similarity)等句子对的回归任务上,已经达到了SOTA的结果。但是,它们都需...

    mathor
  • HDU 1885 Key Task(BFS)

    Key Task Time Limit: 3000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K ...

    ShenduCC
  • php7下安装event扩展

    php7下安装event扩展 有效安排I/O,时间和信号的扩展 使用可用于特定平台的最佳I/O通知机制的事件,是PHP基础设施的libevent端口。 ...

    shaonbean
  • 【AngularJS】—— 12 独立作用域

    前面通过视频学习了解了指令的概念,这里学习一下指令中的作用域的相关内容。 通过独立作用域的不同绑定,可以实现更具适应性的自定义标签。借由不同的绑定规则绑定属...

    用户1154259
  • Flash/Flex学习笔记(4):如何打开网页及Get/Post数据

    flash终究只是客户端技术,所以很多时候还是需要与服务端技术(比如asp,asp.net,jsp,php之类)进行数据交互的,下面的代码演示了如何在flash...

    菩提树下的杨过

扫码关注云+社区

领取腾讯云代金券