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. ...
随机推荐
- 2019 GDUT Rating Contest II : Problem F. Teleportation
题面: Problem F. Teleportation Input file: standard input Output file: standard output Time limit: 15 se ...
- Dart简明教程
[前言]Dart语言是使用flutter框架开发时候必备的语言,flutter是一个跨平台的框架,一套代码就可以完美实现安卓和ios两个平台,适配也很不错,Dart语言很友好,和java很类似,学习成 ...
- 解决unbutu网络编程socket_tcp连接不上网络助手
unbutu开放指定端口 开放端口8080 sudo iptables -I INPUT -p tcp --dport 8080 -j ACCEPT 保存设置 iptables-save 在终端中输入 ...
- “/”应用程序中的服务器错误。||分析器错误消息: 未能加载类型“WebApplication1._Default”
环境VS2008 无法运行WEB项目,Winfrom程序OK. 新创建的WEB项目直接运行报下图错误. 尝试多种方法: 1,重新生成项目,运行.(失败) 2,重装VS2008(默认.完全.自定义)安装 ...
- 前端开发面试题 — css篇
1.介绍一下标准的CSS的盒子模型?低版本IE的盒子模型有什么不同的? (1)有两种, IE 盒子模型.W3C 盒子模型: (2)盒模型: 内容(content).填充(padding).边界(mar ...
- 阅读作业2&CI/CD调研
说明 项目 内容 这个作业属于哪个课程 2021春季软件工程 (罗杰 任健) 这个作业的要求在哪里 个人阅读作业#2 我在这个课程的目标是 初步获得软件工程师的能力 这个作业在哪个具体方面帮助我实现目 ...
- 6.4map用法
map是映射也是常用的STL容器,可以将任何基本类型映射到任何的基本类型,如 map<char,int>mp 一.基本定义 map<typename,typename>mp; ...
- Java(94-100)【数组、对象】
1.数组作为方法的参数 任何数据类型都可以作为方法的参数 直接建立数组的方法,将数组作为方法的参数. 当调用方法的时候传递的是数组的地址. 2.数组作为方法的返回值 任何数据类型都可以作为方法的参数, ...
- 【笔记】《Redis设计与实现》chapter18 发布与订阅
chapter18 发布与订阅 客户端订阅频道. 客户端向频道发送消息, 消息被传递至各个订阅者. 匹配模式 客户端订阅模式. 客户端向频道发送消息, 消息被传递给正在订阅匹配模式的订阅者. 另一个模 ...
- 字符串转成KB,MB, GB
import java.text.DecimalFormat; public class SizeUtil { public static String GetImageSize(String ima ...