<html xmlns="http://www.w3.org/1999/xhtml" lang="gb2312">
<head>
<script type="text/javascript">
function doSomething (obj,evt) {
alert(obj.id);
var e=(evt)?evt:window.event;
if (window.event) {
e.cancelBubble=true;
} else {
e.stopPropagation();
}
}
</script>
</head>
<body>
<div id="parent1" onclick="alert(this.id)" style="width:250px;background-color:yellow">
<p>This is parent1 div.</p>
<div id="child1" onclick="alert(this.id)" style="width:200px;background-color:orange">
<p>This is child1.</p>
</div>
<p>This is parent1 div.</p>
</div>
<br />
<div id="parent2" onclick="alert(this.id)" style="width:250px;background-color:cyan;">
<p>This is parent2 div.</p>
<div id="child2" onclick="doSomething(this,event);" style="width:200px;background-color:lightblue;">
<p>This is child2. Will bubble.</p>
</div>
<p>This is parent2 div.</p>
</div>
</body>
</html>
分享到：
相关推荐
本段代码演示了如何使用JavaScript取消HTML事件的冒泡，即当后代元素的事件被触发时，祖先元素的相同事件也会被触发。...关键词：事件冒泡、取消冒泡、单击事件。用途：学习如何使用JavaScript取消HTML事件的冒泡。
jQuery提供了几种简单有效的方法来取消事件冒泡，这些方法能够帮助开发者更好地控制事件的传播行为。 1. 使用`return false`取消默认行为并阻止冒泡 在jQuery事件处理函数中直接返回`false`是一种最简单的方式来...
这就涉及到了如何取消事件冒泡。 在JavaScript中，有两种主要的方式来阻止事件冒泡： 1. **`event.stopPropagation()`**：这是W3C标准的方法，适用于非IE浏览器。当你在事件处理函数中调用`stopPropagation()`时，...
实现思路：使用 stopPropagation() 方法来取消冒泡事件。在点击空白隐藏的案例中，如果不取消冒泡在点击登录按钮的时候冒泡到了最外层 document。 本资源摘要信息涵盖了多个 JavaScript 知识点，包括拖动水平条、...
本文将深入解析Android中事件捕获和冒泡的流程，帮助开发者更好地理解和运用这一机制。 事件在Android中主要通过View和 ViewGroup对象进行传递。当用户在屏幕上触摸或点击时，系统会生成一个事件对象，如...
本文实例分析了JS冒泡事件与事件捕获。分享给大家供大家参考，具体如下： 案例 <!DOCTYPE html> <html> <head> <title>冒泡事件</title> [removed] [removed] = function(){ ...
JavaScript中的冒泡事件是事件处理中的一个关键概念，它源于事件在DOM（文档对象模型）层级中的传播方式。当一个事件（如鼠标点击）在某个元素上触发时，该事件不仅会在该元素上执行，还会逐级向上层元素传播，直到...
在阻止默认行为和事件冒泡的示例中，展示了`return false`可以同时阻止事件冒泡和取消默认行为。这在处理表单提交或链接点击时很有用，因为它可以防止页面跳转或者表单提交等默认操作。 综上所述，jQuery事件处理...
4. 验证事件冒泡的JavaScript代码示例：该示例说明如何通过绑定点击事件到不同的div元素，并通过注释或取消注释event.stopPropagation()来控制事件冒泡的行为。 ```javascript $(document).ready(function(){ $('...
当触发一个事件时，可以通过获取该事件对象并调用其`preventDefault()`方法来取消默认行为。 ```javascript function handleEvent(event) { event.preventDefault(); // 自定义逻辑 } ``` - **返回`false`**...
在前端开发工作中，由于浏览器兼容性等问题...//否则，我们需要使用IE的方式来取消事件冒泡 window.event.cancelBubble = true; return false; 2.阻止浏览器的默认行为 JavaScript代码 //如果提供了事件对象，则这是
文章目录事件处理模型冒泡捕获触发顺序，先捕获，后冒泡取消冒泡事件阻止默认事件事件对象事件委托事件绑定处理函数的三种方式事件处理程序的内部this指向事件分类 事件处理模型 以下就是事件处理模型例子的代码 ....
冒泡事件在Web开发中非常重要，因为它们允许开发者在父元素上设置事件监听器，以便捕获子元素上发生的事件。 1. 事件目标 在事件处理程序中，event对象的target属性指向触发事件的最原始元素，而this关键字指向绑定...
关于阻止事件捕获，虽然理论上捕获阶段的事件可以被阻止，但实践中很少这样做，因为捕获阶段的事件处理通常用于设置全局的事件监听，而不会期望它们被轻易地取消。 总的来说，理解和掌握事件冒泡、事件捕获以及如何...
冒泡事件是指在一个DOM元素上发生的事件会向上冒泡到父元素，直到最顶层的根元素。在Web开发中，这通常是指事件在DOM树中传播的机制。冒泡事件允许开发者在较低层级的元素上设置事件监听器，而捕捉在更高层级发生的...
浏览器事件动态注册和取消是Web开发中的重要概念，它涉及到JavaScript和DOM（Document Object Model）交互的核心技术。本文将深入探讨这一主题，帮助你更好地理解和掌握网页交互的机制。 首先，事件是用户与网页...
"复选框的全选和取消的例子"是一个实际应用案例，展示了如何实现对一组复选框进行全选和取消全选的功能，同时涉及到了数据的存储与管理，如使用SQL Server 2000数据库进行数据操作。 在这样的系统中，通常会有一个...
在处理事件时，有时我们需要阻止事件的默认行为或者避免事件的冒泡，这就是所谓的事件取消和阻止冒泡。 首先，让我们来理解什么是事件取消。事件取消的目标是防止浏览器执行与特定事件相关的默认行为。例如，当用户...
把这个属性设置为 fasle， //可以取消发生事件的源元素的默认动作。 //window.event?e.returnValue = false:e.preventDefault(); window.event?e.cancelBubble=true:e.stopPropagation(); } 或者： 代