美文网首页
点击弹框以外的区域,隐藏弹框jquery实现

点击弹框以外的区域,隐藏弹框jquery实现

作者: 周超102 | 来源:发表于2017-09-27 11:00 被阅读0次

点击按钮显示某个弹框,然后点击此弹框以外的区域让你隐藏,网上找到了比较好的实现方法,这里做一下总结

原理就是通过js内置的event对象,捕捉到触发事件源,通过检测event对象中是否包含其弹框元素来判断点击区域

注意IE浏览器和W3C标准浏览器下event对象的区别

下面直接贴demo代码吧

相关文章

  • 点击弹框以外的区域,隐藏弹框jquery实现

    点击按钮显示某个弹框,然后点击此弹框以外的区域让你隐藏,网上找到了比较好的实现方法,这里做一下总结 原理就是通过j...

  • demo1 动态显示view或弹框 动态隐藏view或弹框

    有一个弹框,弹框上边有一个关闭按钮,点击按钮,可以关闭弹框。点击弹框的周围区域也可以关闭按钮。 点击上边的隐藏弹框...

  • 遮罩层实现

    代码如下 实现效果:点击按钮,显示遮罩层,弹出弹框点击遮罩层,隐藏遮罩层,隐藏弹框

  • vue中禁止遮罩底层页面滑动

    方法一:在点击事件(弹出弹框)时,添加 在隐藏弹框时 方法二:在点击事件(弹出弹框)时,添加 在隐藏弹框方法中,添加

  • 进阶任务10-事件应用

    实现Tab切换的功能 实现下图的模态框功能,点击模态框不隐藏,点击关闭以及模态框以外的区域模态框隐藏

  • react native 弹框设计,兼容IOS和Android

    1.实现的效果 - 点击按钮,出现弹框,最好有动画; - 点击弹框周围,弹框消失; - 点击Android返回键,...

  • 事件的应用

    1. 实现如下图Tab切换的功能 2. 实现下图的模态框功能,点击模态框不隐藏,点击关闭以及模态框以外的区域模态框隐藏

  • 进阶任务10

    1.实现如下图Tab切换的功能 2.实现下图的模态框功能,点击模态框不隐藏,点击关闭以及模态框以外的区域模态框隐藏

  • 事件的应用

    1.实现如下图Tab切换的功能: 2.实现下图的模态框功能,点击模态框不隐藏,点击关闭以及模态框以外的区域模态框隐藏

  • 进阶任务10(主线任务):事件的应用

    题目1: 实现如下图Tab切换的功能 题目2:实现下图的模态框功能,点击模态框不隐藏,点击关闭以及模态框以外的区域...

网友评论

      本文标题:点击弹框以外的区域,隐藏弹框jquery实现

      本文链接:https://www.haomeiwen.com/subject/hxtspttx.html