先上代码:

<div id='outer' onclick='alert("我是outer")'>
<div id="middle" onclick='alert("我是middle")'>
<div id="inner" onclick='myBubble(arguments[0]);alert("我是inner")'><a onclick='myDefault()' id='dd' href="http://www.baidu.com">js事件</a></div>
</div>
</div>
<script>
function myBubble(e){
var e=e||window.event;
e.stopPropagation?e.stopPropagation():(e.cancelBubble=true);
}
function myDefault(e){
var e=e||window.event;//IE
if(e.preventDefault)//标准
{
e.preventDefault();
}
else if('returnValue' in e )//IE,如果判断条件设成e.returnValue,在IE8及以下版本不识别,本例中点击后会跳转
{
e.returnValue=false;
}
return false; //处理使用对象属性注册的处理程序
}
</script>

上面的代码效果:仅弹出提示窗口“我是inner”。

如果去掉dd中的myDefault函数,则:我是inner>>跳转到百度首页。

如果将上面的两个函数都去掉:我是inner>>我是middle>>我是outer>>跳转到百度首页。

上面的例子主要涉及到事件冒泡和取消默认行为两个方面。

一个取消事件的简单js例子(事件冒泡与取消默认行为)的更多相关文章

  1. javascript 事件委托,jq,js模拟事件

    <!DOCTYPE> <html> <head> <title></title> <script src="Scripts/ ...

  2. JavaScript使用自定义事件实现简单的模块化开发

    WEB前端最常见驱动方式就是事件了, 所有交互等等都是通过事件,前端的常见事件有: UI事件: 焦点事件: 鼠标事件: 滚轮事件: 文本事件: 键盘事件: 变动事件: 现在网页上有一个输入框, 如果我 ...

  3. 探讨Js的事件的冒泡阶段

    近来看到了一个新的知识点叫Js的事件冒泡,因此决定自己来研究一番. 大家应该都知道,Js中的事件处理分为三个阶段,1:事件的捕获阶段,2:处于目标阶段,3:事件的冒泡阶段.那么什么是事件的捕获和冒泡呢 ...

  4. js粘贴事件paste简单解析及遇到的坑

    在用户执行粘贴操作的时候,js能够获得剪切板的内容,本文讨论一下这个问题. 目前只有Chrome支持获取剪切板中的图片数据.还好需要这个功能的产品目前只支持Chrome和Safari,一些Chrome ...

  5. C#利用事件与委托进行窗体间传值简单小例子

    本篇博客是利用C#委托与事件进行窗体间传值的简单小例子 委托与事件的详细解释大家可以参照张子阳的博客: http://www.tracefact.net/CSharp-Programming/Dele ...

  6. 从零开始学习Node.js例子六 EventEmitter发送和接收事件

    pulser.js /* EventEmitter发送和接收事件 HTTPServer和HTTPClient类,它们都继承自EventEmitter EventEmitter被定义在Node的事件(e ...

  7. JS 传播事件、取消事件默认行为、阻止事件传播

    1.事件处理程序的返回值 通常情况下,返回值false就是告诉浏览器不要执行这个事件相关的默认操作.例如,表单提交按钮的onclick事件处理程序能通过返回false阻止浏览器提交表单,再如a标签的o ...

  8. 移动端-js触摸事件

    开发者工具 在移动开发中,一种较为容易的做法是,先在桌面上开始原型设计,然后再在打算要支持的设备上处理移动特有的部分.多点触摸正是难以在PC上进行测试的那些功能之一,因为大部分的PC都没有触摸输入. ...

  9. js关于事件

    摘要:事件在Web前端领域有很重要的地位,很多重要的知识点都与事件有关.本文旨在对常用的事件相关知识做一个汇总和记录. 在前端中,有一个很重要的概念就是事件.我对于事件的理解就是使用者对浏览器进行的一 ...

随机推荐

  1. 【转】每天一个linux命令(24):Linux文件类型与扩展名

    原文网址:http://www.cnblogs.com/peida/archive/2012/11/22/2781912.html Linux文件类型和Linux文件的文件名所代表的意义是两个不同的概 ...

  2. hadoop零基础入门之DKH安装准备

    前几天去参加了一个线下的聚会,参加聚会的基本都是从事互联网工作的.会上有人提到了区块链,从而引发了一场关于大数据方面的探讨.我也是从去年才正式接触大数据,一直在学习hadoop.相信接触过hadoop ...

  3. C# 爬取网页上的数据

    最近工作中需求定时爬取不同城市每天的温度.其实就是通过编程的方法去抓取不同网站网页进行分析筛选的过程..NET提供了很多类去访问并获得远程网页的数据,比如WebClient类和HttpWebReque ...

  4. 修改mui accordion(折叠面板)默认展开收缩行为

    mui的折叠面板 accordion 默认展开收缩逻辑是,展开其中一个的同时收缩起同级已经展开的元素. 实际需求:展开其中一个不必收缩同级元素. 分析mui.js源代码: window.addEven ...

  5. 如何将JQUERY对象转成Javascript对象

    问: <div id="test"></div> $("#test") //由Javascript对象转为Jquery对象: 但是如何转 ...

  6. vertical-align表单元素垂直对齐

    原文地址:http://www.blueidea.com/tech/web/2009/6910.asp 最近的项目涉及到很多表单的制作,特别是复选框(checkbox)和单选框(radio).但是在前 ...

  7. [UE4]角色、动画蓝图、动画蒙太奇、动画之间的调用关系

    一.在“角色”中设置要使用的“动画蓝图” 二.在“动画蓝图”中使用“动画”和“混合动画” 三.在“混合动画”中,也可以使用“动画” 四.在角色中使用“动画蒙太奇”

  8. Python中__init__和__new__的区别详解

    __init__ 方法是什么? 使用Python写过面向对象的代码的同学,可能对 __init__ 方法已经非常熟悉了,__init__ 方法通常用在初始化一个类实例的时候.例如: # -*- cod ...

  9. Doris FE负载均衡配置

    0 背景概述 Doris完全兼容了mysql协议,并且Doris FE本身通过多follower选举机制选举出master,可以保证fe本身的高可用性,也可以通过加入observer fe节点来提高f ...

  10. vb shell函数在c#的转换

    vb shell: Private Sub AddBarcodeImages(ByVal DTab As DataTable) If Not DTab Is Nothing Then DTab.Col ...