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 ...
随机推荐
- socket详解(二)----实例和多线程,线程池使用
一般而言,Java 语言中的套接字有以下两种形式: TCP 套接字(由 Socket 类实现,) UDP 套接字(由 DatagramSocket 类实现) TCP 和 UDP 扮演相同角色,但做法不 ...
- 使用cmd导入导出oracle数据库dmp文件
exp scott/test@192.168.0.195/orcl file=C:\Users\zz\Desktop\1\gd_base.dmp log=C:\Users\zz\Desktop\1\g ...
- python简述
python男神:龟叔 三,python基础初识. 1,运行python代码. 在d盘下创建一个t1.py文件内容是: print('hello world') 打开windows命令行输入cmd,确 ...
- poj1696
没看题解,搜了一下都是什么叉积凸包,根本没有必要用吧.. 显然这个题我们找夹角就可以了,根据高中的公式 a·b=|a|*|b|*cos<a,b> 所以用点积找一个 cos<a,b&g ...
- JAVA课程课后作业03之动手动脑
一.构造函数 问题一: 错误代码如图: 错误原因:从图片中的编译报错的地方来看,程序是在给新的对象分配空间是出现了问题,因而我们往下观察Foo类,Foo类的构造方法是有一个参数的有参方法,而前面构造新 ...
- Brocade SAN交换机常用命令
Brocade SAN交换机常用命令 使用电脑连接Brocade SAN交换机常用命令 使用电脑连接管理网口,默认IP地址为:10.77.77.77,掩码:255.255.255.0 默认用户名:ad ...
- [No0000197]Windows用户都应该知道的运行命令
通过"运行"命令,运行Windows丰富工具的方法.如果您知道工具或任务的相应"运行"命令,那么您就知道访问所述工具或任务的最快方法. 以下是我们最喜欢的Run ...
- Vue中computed,methods 和watch
Vue中的计算属性和方法属性 1.计算属性 computed 模版中可以使用表达式 <div id="example"> {{ message.split('').re ...
- mongo笔记2
速度和持久性 用户可以选择写入语义,决定是否开启journaling日志记录,通过这种方式来控制速度和持久性的平衡,默认情况下写入都是fire-and-forget,写操作通过tcp套接字发送,不要求 ...
- windows加固
1. 账户管理和认证授权 1.1 账户 默认账户安全 禁用Guest账户. 禁用或删除其他无用账户(建议先禁用账户三个月,待确认没有问题后删除.) 操作步骤 打开 控制面板 > 管理工具 > ...