阻止事件冒泡(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上蔓延,但是默认事件任然会执行,当你掉用这个方法的时候,如果点击一个连接,这个连接仍然会被打开, ...
随机推荐
- 合并大量txt文件的内容
首先熟悉一个dos命令 显示文件内容命令——type命令 1.格式:type [盘符:] [路径] 文件名 2.类型:内部命令 3.功能:把指定的文件内容在屏幕上显示或打印机输出,它常用作查阅和显示文 ...
- WIN10主动推升级,有点意思
不论正与盗,皆推升级,是否一样可用?
- UCML平台中 如何设置列表单元格中的链接失效
解决方案: 找到“a.datagrid-cell-bclink”,麻烦的是这个标记是由js动态加载的,需要等待这个加载完成:等加载完成后,删除a标记“$(“a.datagrid-cell-bclink ...
- sail.js学习 - 一些问题
问题: 一.数据填充: 在开发环境中,难免要填充一些基础数据用于测试用.现有两种方法 1.在bootstrap.js或者其他启动文件中创建一些数据 2.https://github.com/frost ...
- PHP中strtotime函数使用方法分享
在PHP中有个叫做strtotime的函数.strtotime 实现功能:获取某个日期的时间戳,或获取某个时间的时间戳.strtotime 将任何英文文本的日期时间描述解析为Unix时间戳[将系统时间 ...
- Winform将网页生成图片
今天无意见看到浏览器有将网页生成图片的功能,顿时赶脚很好奇,于是就找了找资料自己做了一个类似的功能. 工具截图:生成后的图片 手动填写网站地址,可选择图片类型和保持图片地址,来生成页面的图片,当图片路 ...
- MySQL监控工具-orzdba
源代码地址:http://code.taobao.org/p/orzdba/src/trunk/ [root@hank-yoon servers]# chmod +x orzdba 在代码的1 ...
- IOS 基于APNS消息推送原理与实现(JAVA后台)
Push的原理: Push 的工作机制可以简单的概括为下图 图中,Provider是指某个iPhone软件的Push服务器,这篇文章我将使用.net作为Provider. APNS 是Apple Pu ...
- .NET序员的成长之路
- select 取值
select 标签是下拉列表标签.在网站中使用很多. 在后台服务器标记的下拉框在前台都会生成select标签. 他的子项就是option标签.要确认一个项是否被选中,就要确定子项中的selected标 ...