js 取消事件冒泡
html部分
<input type="button" id="btn1" value="按钮" />
<div id="div1"></div>
css部分
<style type="text/css">
#div1{
width: 100px;
height:100px ;
background:#ccc ;
display:none ;
}
</style>
js部分
<script type="text/javascript">
window.onload=function(){
obtn1=document.getElementById('btn1');
odiv1=document.getElementById('div1');
obtn1.onclick=function(ev){
var oEvent=ev||event; //兼容IE跟非IE
oEvent.cancelBubble=true; //取消事件冒泡
odiv1.style.display='block';
}
document.onclick=function(){
odiv1.style.display='none';
}
}
</script>
js 取消事件冒泡的更多相关文章
- JS——取消事件冒泡,实现div的显示与隐藏 event.cancelBubble = true;
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- vue.js阻止事件冒泡和默认事件
首先我们来看原生JS取消事件冒泡方法: e.stopPropagation(); //非IE浏览器window.event.cancelBubble = true; //IE浏览器 原生JS阻止默认事 ...
- 原声js,取消事件冒泡,点击按钮,显示box,点击屏幕其他地方,box隐藏
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- jQuery 取消事件冒泡 阻止后续内容执行 闭包函数 (学习笔记)
1.取消事件冒泡 <title>取消事件冒泡</title> <style> div { border:solid 1px black; } </style& ...
- js 停止事件冒泡 阻止浏览器的默认行为(阻止超连接 # )
在前端开发工作中,由于浏览器兼容性等问题,我们会经常用到“停止事件冒泡”和“阻止浏览器默认行为”. 1..停止事件冒泡 JavaScript代码 //如果提供了事件对象,则这是一个非IE浏览器if ( ...
- jquery取消事件冒泡的三种方法展示
jquery取消事件冒泡的三种方法展示 html代码 <!doctype html> <html> <head> <meta charset="ut ...
- 学习javaScript必知必会(4)~事件、事件绑定、取消事件冒泡、事件对象
1.常用的事件: ① onload:页面加载 ② onblur: 失去焦点 onfocus: 获取焦点 ③ onclick:点击 ④ onmouseover:鼠标经过 onmouseout:鼠标离开 ...
- js 阻止事件冒泡
function stopBubble(e) { //如果提供了事件对象,则这是一个非IE浏览器 if ( e && e.stopPropagation ) //因此它支持W3C的st ...
- 浅谈js的事件冒泡机制
很多人都听说过,js的事件冒泡机制,其实,这个说法还是比较生动形象的,就是一个水泡在水底下,冒泡到水面的过程. 那js的事件冒泡机制呢,就是一个DOM树,一级一级向上冒的过程,最终是到document ...
随机推荐
- DeBug Python代码全靠print函数?换用这个一天2K+Star的工具吧,改进版
pysnooper是代码debug神器,比无限low print好很多和也比日志debug好一些,比断点调试也好一些,这个很犀利的装饰器. https://www.toutiao.com/a66829 ...
- php四个常用类封装
这4个类分别是Mysql类. 分页类.缩略图类.上传类. Mysql类 <?php /** * Mysql类 */ class Mysql{ private static $link = nul ...
- CF 1131C Birthday
C. Birthday time limit per test 1 second memory limit per test 256 megabytes input standard input ou ...
- 如何写Emit代码
写Emit代码也不是想象中的那么复杂,基本过程就是先手工写好C#代码,编译得到Exe或者Dll,然后用ILDASM或反编译工具,得到IL代码,最后就是看着IL代码,用Emit一个个对应发出代码,就行了 ...
- php项目,别人无法访问自己(windows 系统)上Apache服务器原因(转载)
别人无法访问自己电脑上的Apache服务器,其中最大的原因是因为Windows防火墙的因素. 1.有安装防火墙的,把防火墙关闭 2.windows默认带防火墙的,进入 控制面板-系统和安全-Windo ...
- archlinux 下使用 aria2+uget 作为下载工具
1.创建配置文件 sudo vim /etc/aria2/aria2.conf ## /etc/aria2/aria2.conf### '#'开头为注释内容, 选项都有相应的注释说明, 根据需要修改 ...
- 设置头像、商品、轮播图为背景图时需要的css
background-repeat: no-repeat;background-size: cover;background-position: center center;
- 判断网页请求与FTP请求
实例说明 在访问Internet网络时,经常涉及到很多访问协议,其中最明显.最常用的就是访问页面的http协议.访问ftp服务器的FTP协议等.
- eclipse测试链接sql server2008 数据库
注:在测试连接数据库之前必须保证SQL Server 2008是采用SQL Server身份验证方式而不是windows身份验证方式.如果在安装时选用了后者,则需要重新进行配置. 首先 使用命令行测试 ...
- Maven常用的几个命令
mvn clean.mvn package:如果本地仓库中没有需要的jar,第一次执行命令的时候会从仓库下jar包 *) mvn clean :clean项目 *) mvn compile : 编译 ...