<!DOCTYPE HTML>
<html>
<head>
<title>event cancel</title>
</head>

<body>

<a href="https://www.baidu.com/">baidu</a>

<div style="width: 400px; height: 300px; background: red;" id="d1">
<div style="width: 250px; height: 250px; background: yellow;" id="d2">
<button id="btn1">click me</button>
</div>
</div>

</body>
</html>

<script type="text/javascript" >

document.getElementsByTagName("a")[0].onclick = function(e){
cancelHandler(e); //取消a标签打开连接的事件， 然后执行click事件
alert("cancel the default event!");
}

function cancelHandler (event) {
　　var event = event || window.event; // for ie

　　//取消事件相关的默认行为
　　if(event.preventDefault) event.preventDefault(); //标准技术
　　if(event.returnValue) event.returnValue = false;

　　return false; //用于处理对象属性注册的处理程序。
}

//测试冒泡时间

document.getElementById("d1").onclick = function () {
　　alert("d1 clicked");
}

document.getElementById("d2").onclick = function () {
　　alert("d2 clicked");　　//点击d2会触发两次点击时间, 一次是d2自己的, 第二次是父亲d1的

}

document.getElementById("btn1").onclick = function (e) {
　　e.stopPropagation(); //阻止向上冒泡
　　alert("button clicked");
}

</script>

JavaScript 阻止默认时间和冒泡时间的更多相关文章

  1. javascript -- 阻止默认事件 阻止事件冒泡

    1. event.preventDefault();  -- 阻止元素的默认事件.注:a元素的点击跳转的默认事件 , button,radio等表单元素的默认事件 , div 元素没有默认事件 例: ...

  2. jquery 阻止冒泡事件和阻止默认事件

    jQuery 冒泡和默认事件: <!DOCTYPE html> <html lang="en"> <head> <meta charset ...

  3. JavaScript事件：事件处理模型(冒泡、捕获)、取消冒泡、阻止默认事件

    (一)事件处理模型---事件冒泡.捕获 (1)事件冒泡 24 <body> 25 <div class="warpper"> 26 <div clas ...

  4. javascript 阻止事件冒泡和阻止默认事件对比

    公司项目有像上图中效果的功能需求这也是很常见功能很简单功能,通过一个小例子和大家聊聊js的事件冒泡和默认事件. 先说说一般的实现方式即使用阻止事件冒泡的方式去做,给input绑定一个click事件(并 ...

  5. Javascript和jquery事件--阻止事件冒泡和阻止默认事件

    阻止冒泡和阻止默认事件—js和jq相同,jq的event是一个全局的变量 我们写代码的时候常用的都是事件冒泡,但是有的时候我们并不需要触发父元素的事件,而浏览器也有自己的默认行为(表单提交.超链接跳转 ...

  6. javascript的阻止默认事件和阻止冒泡事件

    这两个方面的知识,在妙味课堂中有听过,再次复习一下: 原文来自:[http://www.cnblogs.com/Essence/p/4266618.html] 事件冒泡与默认行为   在说事件冒泡之前 ...

  7. jQuery阻止默认行为和阻止冒泡

    1.阻止默认行为:通常是值一个标签的默认行为,如button的提交表单,a标签的跳转等. 那如何阻止标签的默认行为? 1)return false 2) e.preventDefault(); < ...

  8. js阻止默认事件，如a标签跳转和事件冒泡

    禁止a标签点击跳转 <a href="http://baidu.com" onclick="return false">点我啊</a> ...

  9. 18.阻止默认操作e.preventDefault();防止冒泡事件：e.stopPropagation()

      一.加了e.preventDefault();会阻止a标签默认的点击跳转效果 <!DOCTYPE html> <html lang="en"> < ...

随机推荐

  1. ​ScrollView、ListView嵌套

    1.手动设置ListView高度 经过测试发现,在xml中直接指定ListView的高度,是可以解决这个问题的,但是ListView中的数据是可变的,实际高度还需要实际测量.于是手动代码设置ListV ...

  2. Mavne + Spring整合CXF

    http://blog.csdn.net/xiongyu777888/article/details/23787615(没毛病) http://blog.csdn.net/hbsong75/artic ...

  3. JavaScript 字符串

    字符串属性 属性 描述 constructor 返回创建字符串属性属性的函数 length 返回字符串的长度 prototype 允许您向对象添加属性和方法 字符串方法 Method 描述 charA ...

  4. linux术语解析（持续更新）

    1.linux内核有个版本,分别是 longterm: 提供长期支持的内核版本 stable: 稳定版本 Beta 测试版

  5. poi大数据将excel2007导入数据库

    package com.jeeframe.cms.updata.service.impl; import java.io.IOException; import java.io.InputStream ...

  6. SxsTrace工具使用方法(转)

    http://blog.sina.com.cn/s/blog_494e45fe0102dtt3.html Windows7平台上有一个强大的SxsTrace工具,可以跟踪调试应用程序运行时需要的动态库 ...

  7. 225 Implement Stack using Queues(用队列实现栈Medium)

    题目意思:用队列实现栈,push(),pop(),top(),empty() 思路:用两个queue,pop时将一个queue的元素pop再push到另一个队列,queue只留最后一个元素,并pop, ...

  8. MySql存储过程—2、第一个MySql存储过程的建立

    看看如何创建一个存储过程.虽然通过命令行可以创建,但基本通过MySQL提供的Query browser来创建. 1.首先我们通过Administrator在test数据库中创建一个简单的表名叫”pro ...

  9. 30 个 Python 语言的特点技巧

    1   介绍 从我开始学习Python时我就决定维护一个经常使用的“窍门”列表.不论何时当我看到一段让我觉得“酷,这样也行!”的代码时(在一个例子中.在StackOverflow.在开源码软件中,等等 ...

  10. TCP回射服务器程序：main函数

    TCP回射并发服务器 1.创建套接字,绑定服务器的众所周知端口 创建一个TCP套接字,在待绑定到该TCP套接字的网际网套接字地址结构中填入通配地址(INADDR_ANY) 和服务器的众所知周(SERV ...