嵌套DIV中的onClick事件在嵌套容器中的连环作用

嵌套DIV中的onClick事件在嵌套容器中的连环作用：

===========================
遇到一个奇怪的问题，代码如下：
===========================

<html>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=gb2312">
<head>
<style>
.div0{
background-color:#555555;
width:210px;
height:210px;
position:absolute;
}
.div1 {
margin:30;
background-color:#000000;
width:150px;
height:150px;
position:absolute;
}
.div2 {
margin:30;
padding:30;
background-color:#ffffff;
width:90px;
height:90px;
position:absolute;
font-size:20px;
}
</style>
<script>
function a(obj){
alert("id:"+obj.id);
}
</script>
</head>

<body>
<div id="d0" class="div0"
<div id="d1" class="div1"
<div id="d2" class="div2" οnclick="a(this)">测试</div>
</div>
</div>
</body>
</html>
====================
问题描述：
====================

在嵌套容器中，为什么我点击最里面div后会触发父div的onclick事件？由此形成一个连环调用，这样很不方便，因为我只是需要此时单击的那个div。这种现象应该是内定规则，有没有关于此连环调用现象的官方解释？

这是事件的浮升（冒泡）
禁止事件浮升用event.cancelBubble=true

<div id="d0" class="div0"
<div id="d1" class="div1"
<div id="d2" class="div2" οnclick="a(this);event.cancelBubble=true;">测试</div>
</div>
</div>

转载于:https://blog.51cto.com/zhanyah/800514

嵌套DIV中的onClick事件在嵌套容器中的连环作用相关推荐

js中的onclick事件在ul获取li时点击两次才会执行的原因
js中的onclick事件在ul获取li时点击两次才会执行的原因下面的代码中只有onclick第二次才会执行函数内部的代码代码实例如下: <!DOCTYPE html> <ht ...
Algorithm：C++语言实现之概率算法相关问题(计算机中的概率事件、C语言中的随机事件、产生二维随机数、圆内均匀取点)
Algorithm:C++语言实现之概率算法相关问题(计算机中的概率事件.C语言中的随机事件.产生二维随机数.圆内均匀取点) 目录一.概率 1.计算机中的概率事件 1.1.C语言中的随机事件 1.2 ...
vue中使用mousewheel事件在火狐浏览器中不生效
vue中使用mousewheel事件在火狐浏览器中不执行将mousewheel修改为wheel就可以了.
js中的onclick事件和JQuery中的click方法以及on方法事件用法总结
1.onclick是绑定的事件(它是一个事件),注意该事件绑定只是JacaScript中有(js中的),Jquery中并没有此事件,告诉浏览器在鼠标点击时候要做什么 2.click方法(jquery中 ...
jq onclick 定义_关于js中的onclick事件和JQuery中的click方法
1.onclick是绑定的事件(它是一个事件),注意该事件绑定只是JacaScript中有,Jquery中并没有此事件,告诉浏览器在鼠标点击时候要做什么测试onclick事件 function mo ...
input按钮中的onclick事件
input按钮onclick事件大全 <INPUT οnclick=document.all.WebBrowser.ExecWB(1,1) type=button value=打开 name=B ...
html中的鼠标事件怎么写,html5中的鼠标事件以及鼠标事件属性
鼠标事件先列出html5中鼠标常见的一系列事件: 事件名称描述 onclick 当单击鼠标时运行脚本 ondblclick 当双击鼠标时运行脚本 ondrag 当拖动元素时运行脚本 ondrage ...
html中单击按钮事件,处理C++代码中的HTML按钮单击事件
我有一个Windows本机C++/Win32/MFC对话框应用程序.我正在使用对话框中的IE ActiveX控件来呈现一些HTML内容.正在呈现的HTML包含一个按钮.该按钮具有onClick Jav ...
vue中点击事件的写法_vue中的事件：原生事件与自定义事件__Vue.js
模板编译 processAttrs 对于ast attributes处理(v-on/@) 利用onRE与dirRE来捕获事件这里最重要的就是dynamic的判断,vue中可以用动态参数来命名事件名称 ...
c# 火狐浏览器怎么嵌入窗体中_C#WinForm窗体内Panel容器中嵌入子窗体、程序主窗体设计例子...
C#WinForm父级窗体内Panel容器中嵌入子窗体.程序主窗体设计例子在项目开发中经常遇到父级窗体嵌入子窗体所以写了一个例子程序,顺便大概划分了下界面模块和配色,不足之处还望指点主窗体窗体采用 ...

嵌套DIV中的onClick事件在嵌套容器中的连环作用

嵌套DIV中的onClick事件在嵌套容器中的连环作用相关推荐

最新文章

热门文章