点击空白处隐藏div-阻止事件冒泡
$(" body").click(function(){
$("#div").hide();
});
$("button").click(function(e){
$("div").show();
e.stopPropagation();//阻止冒泡到body
});
$("#div").click(function(e){//自己要阻止
e.stopPropagation();//阻止冒泡到body
});
点击空白处隐藏div-阻止事件冒泡的更多相关文章
- 点击其它地方隐藏div/事件冒泡/sweet-alert阻止冒泡
点击document时把div隐藏,但点击div时阻止点击事件冒泡到document,从而实现“点击文档其它地方隐藏div,点击div本身不隐藏”.js代码如下:$("#div") ...
- 点击空白处隐藏div
class="bigPic"的div是被显示或隐藏的div,另外.case > ul > li是class="bigPic"的父级元素 $(&quo ...
- jquery 点击空白处隐藏div元素
<style type="text/css">.pop {display:none;width: 200px;height: 130px;background: #08 ...
- 深入React事件系统(React点击空白部分隐藏弹出层;React阻止事件冒泡失效)
只关注括号内问题的同学,可直接跳转到蓝字部分.(标题起的有点大,其实只讨论一个问题) 两个在React组件上绑定的事件,产生冲突后,使用e.stopPropagation(),阻止冒泡,即可防止事件冲 ...
- 在点击div中的p时,如何阻止事件冒泡?
今天整理笔记,发现在学习javaScript的过程中,遇到过一个在当时看来很棘手的问题,现在特地总结一下,也希望能帮助到曾像我一样迷惘的初学者. 我还是以一个案例来说明问题,html代码如下: < ...
- react 点击空白处隐藏弹出层
点击空白处隐藏弹出层的原理是:在 document 上绑定事件来隐藏弹出层,这样点击任何元素的时候都会冒泡到 document 上,都会执行隐藏弹出层的功能.然后我们在不需要隐藏弹出层的元素上阻止冒泡 ...
- javascript 阻止事件冒泡和阻止默认事件对比
公司项目有像上图中效果的功能需求这也是很常见功能很简单功能,通过一个小例子和大家聊聊js的事件冒泡和默认事件. 先说说一般的实现方式即使用阻止事件冒泡的方式去做,给input绑定一个click事件(并 ...
- JAVAscript——菜单下拉列表练习(阻止事件冒泡)
下拉列表框,鼠标点击文本框,出现下拉,鼠标(离开的时候或者点击网页其他位置时)下拉列表消失.鼠标放到下拉列表的某一项上变背景色,点击下拉列表的某一项将该项的值显示在文本框内,然后下拉列表消失. < ...
- React 中阻止事件冒泡的问题
在正式开始前,先来看看 JS 中事件的触发与事件处理器的执行. JS 中事件的监听与处理 事件捕获与冒泡 DOM 事件会先后经历 捕获 与 冒泡 两个阶段.捕获即事件沿着 DOM 树由上往下传递,到达 ...
随机推荐
- c语言的学习秘籍
c语言其实是一环套一环胡的,最开始的是变量,然后是数组,接着是结构体,接着是链表.(其他的是c语言的语法,那东西大多了就会了.) 学习时可以从程序在电脑里的内存看起,先了解变量,将多个变量连起来就是数 ...
- Visual Studio常用插件
Visual Assist X 番茄不用说了,C# C++编码必备 Image Insertion 可以在代码编辑器中插入图片注释,让代码像Word文档一样图文并茂. 但注意必须是PNG格式的图片,直 ...
- [3] 智能指针std::auto_ptr
[1]std::auto_ptr 对于编译器来说,智能指针实质是一个栈对象,而并非指针类型. 智能指针通过构造函数获取堆内存的管理所有权,而在其生命期结束时,再通过析构函数释放由它所管理的堆内存. 所 ...
- JavaScript原型理解
这东西我还不是很理解,但是把自己实践的过程记录下来,希望积累到一定程度,能自然而而然的理解了.很多东西我是这样慢慢理解的,明白为啥是那样子,真的很神奇哦.少说废话,开始吧. 可以先阅读这篇文章 fun ...
- Egret引擎随学随机
1.纹理集实际上就是将一些零碎的小图放到一张大图当中.游戏中也经常使用到纹理集.使用纹理集的好处很多,我们通过将大量的图片拼合为一张图片从而减少网络请求,原先加载数次的图片资源现在加载一次即可.同时, ...
- Hadoop之为何不使用RAID?
一.引言: 在一次和同事的讨论中遇到一个这样的问题:有一个hadoop集群,在hbase的put数据出现瓶颈,他们想要把datanode上的磁盘做成RAID 0(比如10块磁盘做成一个RAID 0), ...
- 自己封装的json工具类
package com.develop.util; import java.util.ArrayList; import java.util.HashMap; import java.util.Ite ...
- laravel框架总结(七) -- 数据库操作
1.使用DB门面进行基本操作 一旦你设置好了数据库连接,就可以使用 DB facade 来进行查找.DB facade 提供每个类型的查找方法:select.update.insert.delet ...
- Linux的加密认证功能以及openssl详解
一.详细介绍加密.解密技术 现在的加密/解密技术主要有三种:对称加密,非对称加密,和单向加密 这三种加密解密技术的组合就是现在电子商务的基础,它们三个有各自最适合的领域,而且所要完成的功能也是不同的, ...
- GZFramwork数据库层《前言》Demo简介
本系列旨在熟悉GZFramwork数据库层操作,对数据库表进行增删改查,单据编号生成等: 详细见图: 普通单表操作: 数据库建模: 创建表脚本: from sys.sysreferences r jo ...