阻止事件冒泡(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上蔓延,但是默认事件任然会执行,当你掉用这个方法的时候,如果点击一个连接,这个连接仍然会被打开, ...
随机推荐
- 2015.1写留言板的时用的 知识点和函数 --->总结
一:时间函数和uniqid() 1:uniqid():生成唯一的id, 无参数返回的字符串的长度为13,有参数为23 2:时间和时间戳相互转换的php函数 ①:time() 返回当前unix的时间戳 ...
- 《PHP和MySQL Web开发》精彩的地方收录
1.用SESSION来做的购物车,做成数组,用isbn对应书的数量作为二维数组保存 $new GET传值加入购物车,submit是修改数量,提交后的表单,通过历遍原来的数组,对应isbn修改最新的数量 ...
- SQL Server 2014 Always on ON Microsoft Azure New Portal(1)
以前假如需要在Azure IaaS 创建的SQL Server AlwaysOn 需要参考以下的步骤 From the MVPs: SQL Server High Availability in Wi ...
- Windows7 sp1 64位下安装配置eclipse+jdk+CDT+minGW
需要的工具: jdk-7u11-windows-x64.exe eclipse-SDK-4.2.2-win32-x86_64.zip cdt-master-8.1.2.zip mingw-get-i ...
- .Net码农学Android---前言
自从毕业参加工作后,就一直想学移动领域得开发,但时间.精力.决心.学习成本等这些问题总在不同程度的阻碍着自己. 但这段时间自己想做一款属于自己的App的想法越来越强烈,我感到自己快压不住这股能量了.终 ...
- STL算法
STL算法部分主要由头文 件<algorithm>,<numeric>,<functional>组成.要使用 STL中的算法函数必须包含头文件<algorit ...
- iOS/Objective-C开发 字典NSDictionary的深复制(使用category)
目标:把NSDictionary对象转换成NSMutableDictionary对象,对象内容是字符串数组,需要实现完全复制(深复制). 如果调用NSDictionary的mutableCopy方法, ...
- MVC初学 - The type or namespace name 'DbContext' could not be found
问题: The type or namespace name 'DbContext' could not be found (are you missing a using directive or ...
- NP完全问题
1.概念 好算法:Edmonds与1975年提出:具有多项式时间(O(nk)的算法为好算法. P类问题:存在多项式时间算法的问题.如:货郎问题.调度问题.最大团问题.最大独立集问题.Steiner树问 ...
- c++各种排序
1.插入排序 void InsertSort(int a[], int n) { int temp, i, j; ; i < n; i++) { ]) { temp = a[i]; ; j &g ...