JS阻止冒泡事件
<!DOCTYPE html>
<html>
<head>
<title></title>
<style type="text/css">
#dv1{
width: 500px;height: 500px;background: red;border: 1px solid;
}
#dv2{
width: 400px;height: 400px;background: blue;border: 1px solid;
}
#dv3{
width: 200px;height: 200px;background: yellow;border: 1px solid;
}
</style>
</head>
<body>
<div id ="dv1">
<div id ="dv2">
<div id ="dv3"></div>
</div>
</div>
<script type="text/javascript">
var b1=document.getElementById('dv1');
var b2=document.getElementById('dv2');
var b3=document.getElementById('dv3');
b1.onclick=function () {
alert(1);
// body...
}
function zuzhi(evt){
var e=evt||window.event
window.event? e.cancelBubble=true:e.stopPropagation();
}
b2.onclick=function () {
alert(2)
// body...
}
b3.onclick=function () {
alert(3);
zuzhi();
// body...
}
</script>
</body>
</html>
JS阻止冒泡事件的更多相关文章
- js阻止冒泡事件和默认事件的方法
阻止默认事件 function stopDeFault(e){ if(e&&e.preventDefault){//非IE e.preventDefault(); }else{//IE ...
- js 阻止冒泡事件和默认事件
阻止事件冒泡 window.enent ? window.enent.cancelBubble = true : e.stopPropagation() function stopBubble(eve ...
- JS阻止冒泡事件以及默认事件发生的简单方法
如果<p>是在<div>里面,那么呢,<P>有一个onclick事件,<div>也有onclick事件,为了触发<P>的点击事件时,不触发父 ...
- js阻止冒泡事件及默认操作
1. 事件目标 现在,事件处理程序中的变量event保存着事件对象.而event.target属性保存着发生事件的目标元素.这个属性是DOM API中规定的,但是没有被所有浏览器实现 .jQuery对 ...
- JS点击子元素不触发父元素点击事件(js阻止冒泡)
js阻止冒泡 <html> <title></title> <head> <meta charset="utf-8"> ...
- js阻止冒泡及jquery阻止事件冒泡示例介绍
js阻止冒泡 在阻止冒泡的过程中,W3C和IE采用的不同的方法,那么我们必须做以下兼容. 复制代码 代码如下: function stopPro(evt){ var e = evt || window ...
- js阻止冒泡和默认事件（默认行为）详解- jquery DefaultPrevented 函数
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> & ...
- js中冒泡事件和捕获事件
js中冒泡事件和捕获事件: 冒泡事件:冒泡事件是从里向外,即是从被绑定元素开始一直向外到达页面的所有祖先元素都会被触发,这 一过程被称为事件冒泡.这个事件从原始元素开始一直冒泡到DOM树的最上层 捕获 ...
- DOM2级事件对象、添加事件、阻止默认事件、阻止冒泡事件、获取事件对象目标的兼容处理
事件对象——兼容处理 /* * 功能: 事件对象兼容 * 参数: 表示常规浏览器的事件对象e */ function getEvent(e) { // 如果存在e存在,直接返回,否则返回window. ...
随机推荐
- android分析之Thread类
线程与线程类要区分开来. 抽象来说,线程是CPU调度的最小单位,但是线程总要执行代码,这个代码就在线程类里说明(即Thread类).无论如何,Thread只是一个类,但其功能就是"启动一个线 ...
- Git - 使用命令和P4Merge进行diff
P4Merge P4Merge是Git的一个第三发Diff和Merge工具(可视化冲突解决工具). 下载地址: https://www.perforce.com/downloads/visual-me ...
- golang 性能调优分析工具 pprof (上)
一.golang 程序性能调优 在 golang 程序中,有哪些内容需要调试优化? 一般常规内容: cpu:程序对cpu的使用情况 - 使用时长,占比等 内存:程序对cpu的使用情况 - 使用时长,占 ...
- redis数据库如何批量删除键和设置过期时间？
我们可以借助Linux中的xargs,在终端中执行命令来实现这两个功能. 一.批量删除键 批量删除以"key"开头key的方法,需要借助Linux中的xargs,在终端中执行以下命 ...
- 图像Resize方式对深度学习模型效果的影响
在基于卷积神经网络的应用过程中,图像Resize是必不可少的一个步骤.通常原始图像尺寸比较大,比如常见监控摄像机出来的是1080P高清或者720P准高清画面,而网络模型输入一般没有这么大,像Yolo系 ...
- B. 【例题2】雷达装置
B . [ 例 题 2 ] 雷 达 装 置 B. [例题2]雷达装置 B.[例题2]雷达装置 题目解析 求最少所需的雷达数,考虑贪心算法. 以这张图为例.以一个城市为中心,作一个半径为 d d d的圆 ...
- java面试-synchronized底层实现机制
一.synchronized的三种应用方式 1.修饰实例方法,锁是当前实例对象,进入同步代码前要获得当前实例的锁 /** * synchronized修饰实例方法,当前线程的锁是实例对象account ...
- 2020 OO 第一单元总结 表达式求导
title: BUAA-OO 第一单元总结 date: 2020-03-19 20:53:41 tags: OO categories: 学习 OO第一单元通过三次递进式的作业让我们实现表达式求导,在 ...
- 「HTML+CSS」--自定义加载动画【015】
前言 Hello!小伙伴! 首先非常感谢您阅读海轰的文章,倘若文中有错误的地方,欢迎您指出- 哈哈 自我介绍一下 昵称:海轰 标签:程序猿一只|C++选手|学生 简介:因C语言结识编程,随后转入计算机 ...
- Mysql事务原理
一.什么是事务 事务:是数据库操作的最小工作单元,是作为单个逻辑工作单元执行的一系列操作:这些操作作为一个整体一起向系统提交,要么都执行.要么都不执行:事务是一组不可再分割的操作集合(工作逻辑单元): ...