阻止事件冒泡(stopPropagation和cancelBubble)和阻止默认行为(preventDefault和returnValue)
<div id="divId1" style="width:500px;height:500px;background-color:#3ac;text-align:center;" align="center">
<div id="divId2" style="width:400px;height:400px;background-color:#f1f; margin:0 auto;">开始啦</div>
</div> document.getElementById('divId1').onclick = function(){
alert('divId1');
}
var eleDiv2 = document.getElementById('divId2');
if(eleDiv2.addEventListener){
eleDiv2.addEventListener('click',function(evt){
alert('divId2');
evt.stopPropagation();
},false);
}else{
eleDiv2.attachEvent('onclick',function(evt){
alert('divId2');
evt.cancelBubble = true;
});
}
//阻止冒泡事件
function stopBubble(e) {
if (e && e.stopPropagation) {//非IE
e.stopPropagation();
}
else {//IE
window.event.cancelBubble = true;
}
} function stopDefault(e) {
//阻止默认浏览器动作(W3C)
if (e && e.preventDefault)
e.preventDefault();
//IE中阻止函数器默认动作的方式
else
window.event.returnValue = false;
return false;
}
阻止事件冒泡(stopPropagation和cancelBubble)和阻止默认行为(preventDefault和returnValue)的更多相关文章
- JavaScript--阻止事件冒泡stopPropagation和cancelBubble
<!DOCTYPE html> <html lang="en" xmlns="http://www.w3.org/1999/html"> ...
- js中阻止事件冒泡和浏览器默认行为
在使用javascript编程时会遇到一个问题,就是当你给html添加事件时,由于浏览器默认的为冒泡型事件触发机制,所以会触发你不想触发的事件.那么通过如下的函数可以解决这个问题.[兼容IE和FF] ...
- JS---DOM---事件冒泡和阻止事件冒泡,总结事件
事件冒泡: 多个元素嵌套, 有层次关系 ,这些元素都注册了相同的事件, 如果里面的元素的事件触发了, 外面的元素的该事件自动的触发了 事件有三个阶段: 1.事件捕获阶段 :从外向内 2.事件 ...
- js阻止浏览器、元素的默认事件与js阻止事件冒泡、阻止事件流
嵌套的div元素,如果父级和子元素都绑定了一些事件,那么在点击最内层子元素时可能会触发父级元素的事件,下面介绍一下js阻止默认事件与js阻止事件冒泡示例,大家参考使用吧 1. event.prev ...
- 阻止JS事件冒泡传递(cancelBubble 、stopPropagation)
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx. ...
- js 阻止事件冒泡和默认行为 preventDefault、stopPropagation、return false
preventDefault: preventDefault它是事件对象(Event)的一个方法,作用是取消一个目标元素的默认行为.既然是说默认行为,当然是元素必须有默认行为才能被取消,如果元素本身就 ...
- 阻止事件冒泡,阻止默认事件,event.stopPropagation()和event.preventDefault(),return fal的区别
今天来看看前端的冒泡和事件默认事件如何处理 1.event.stopPropagation()方法 这是阻止事件的冒泡方法,不让事件向documen上蔓延,但是默认事件任然会执行,当你掉用这个方法的时 ...
- 阻止事件冒泡两种方式:event.stopPropagation();和return false;
jQuery提供了两种方式来阻止事件冒泡. 方式一:event.stopPropagation(); $("#div1").mousedown(function (event) { ...
- JS 之 阻止事件冒泡,阻止默认事件,event.stopPropagation()和event.preventDefault(),return false的区别
在前端开发中,有时我们需要阻止冒泡和阻止默认事件的发生. 一.event.stopPropagation() 阻止事件的冒泡,不让事件向documen上蔓延,但是默认事件任然会执行,当调用这个方法的时 ...
- 阻止事件冒泡,阻止默认事件,event.stopPropagation()和event.preventDefault(),return false的区别
1.event.stopPropagation()方法 这是阻止事件的冒泡方法,不让事件向documen上蔓延,但是默认事件任然会执行,当你掉用这个方法的时候,如果点击一个连接,这个连接仍然会被打开, ...
随机推荐
- OpenDaylight之openflowjava的编译
最近因为工作需要开始研究opendaylight,首先需要的是编译项目. 因为项目代码都是在git.opendaylight.org上的,所以需要先安装git工具. 另因为opendaylight项目 ...
- Entity Framework 并发处理借鉴
如下博客 http://www.cnblogs.com/Bce-/p/3725868.html
- php读取excel日期类型数据的例子
提供一个读取的函数: 代码如下 复制代码 //excel日期转换函数function excelTime($date, $time = false) { if(function_exists('Gr ...
- 加载页面遮挡耗时操作任务页面--第三方开源--AndroidProgressLayout
在Android的开发中,往往有这种需求,比如一个耗时的操作,联网获取网络图片.内容,数据库耗时读写等等,在此耗时操作过程中,开发者也许不希望用户再进行其他操作(其他操作可能会引起逻辑混乱),而此时需 ...
- How to enables AX email functionality without Outlook
/***************************************************************** (C) Copyright DENTSPLY Internatio ...
- Freemarker例子
1.引入架包 2.写ftl文件 3.代码 hello.ftl 你好啊,${hello},今天你的精神不错! if else 语句测试 <#if num gt 18><#-- 不使用 ...
- 虚拟机开机提示:This virtual machine appears to be in use
[原因]:由于电脑非正常关机导致,重新启动虚拟机就会出现This virtual machine appears to be in use的提示.[解决方法]:到虚拟机的安装目录下删除所有.lck的目 ...
- Linux驱动开发之开篇--HelloWorld
Linux驱动的编写,大致分为两个过程,第一个过程为测试阶段,即为某一具体的设备,添加必要的驱动模块,为了节省编译时间,需要将代码单独放在一处,在编译时,只需要要调用内核的头文件即可:第二个过程为布置 ...
- 含有自增序列的表中使用truncate与delete的不同结果
一个含有自增序列的表,使用delete跟truncate之后会有什么不同结果呢? 大概说一下,使用truncate,表中的记录全部被清除,如果向表中插入数据,那么数据的排序是从1开始的. 如果使用的是 ...
- 华为章宇:如何学习开源项目及Ceph的浅析
转自http://www.csdn.net/article/2014-04-10/2819247-how-to-learn-opensouce-project-&-ceph 摘要:开源技术的学 ...