阻止事件冒泡(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上蔓延,但是默认事件任然会执行,当你掉用这个方法的时候,如果点击一个连接,这个连接仍然会被打开, ...
随机推荐
- NFS参数配置详细说明
摘抄自:http://www.linuxidc.com/Linux/2012-05/61527p3.htm 1.NFS概述 NFS:Network file system,网络文件系统: 由sun公司 ...
- flex基础学习
Flex是Adobe开发的一种RIA,富互联网应用,用Flex开发的东西都可以使用Flash做出来,但是Flex主要是面向的程序开发人员,前台使用ActionScript和MXML. 上面介绍了fle ...
- 生成动态前缀且自增号码的Oracle函数
create or replace Function GetInvitationNO(prev varchar2, num1 varchar2, num2 varchar2, sessionSetti ...
- 解析php时间戳与日期的转换
php中时间戳与日期的转换. 实现功能:获取某个日期的时间戳,或获取某个时间的PHP时间戳. strtotime能将任何英文文本的日期时间描述解析为Unix时间戳,我们结合mktime()或date( ...
- IIFE-js中(function(){…})()立即执行函数写法理解
介绍IIFE IIFE的性能 使用IIFE的好处 IIFE最佳实践 jQuery优化 在Bootstrap源码(具体请看<Bootstrap源码解析>)和其他jQuery插件经常看到如下的 ...
- sqlServer2008 手工注入
接着上一篇的<mysql手工注入> 参考:http://hi.baidu.com/ciqing_s/item/971bf994365130accc80e5ed http://hi.baid ...
- Delphi XE5教程1:语言概述
内容源自Delphi XE5 UPDATE 2官方帮助<Delphi Reference>,本人水平有限,欢迎各位高人修正相关错误! 也欢迎各位加入到Delphi学习资料汉化中来,有兴趣者 ...
- Oracle 主键
给student 表产生 自增的序列主键 increment ; ----IBATIS简单入门教程http://www.cnblogs.com/ycxyyzw/archive/2012/10/13/2 ...
- APACHE 403 FORBIDDEN错误的解决办法之一
打开 apache的配置文件httpd.conf,找到这段代码: Options FollowSymLinksAllowOverride NoneOrder deny,allowDeny from a ...
- C# Windows - 创建控件
VS提供了一个项目类型Windows Control Library,使用它可以创建自己的控件. 可以开发两种不同类型的自定义控件: 用户或组合控件:这种控件是根据现有控件的功能创建一个新控件.这类控 ...