在javascript中如何取消事件冒泡
如果在javascript中只希望事件发生在它的目标而不是在它的父元素上,即取消它的冒泡事件的发生,该如何做?因为按照javascript发生事件的顺序,它由两个阶段:分别从根元素--父元素--目标元素(捕获阶段),再到父元素--根元素(冒泡阶段)。
IE浏览器和其他浏览器提供了不同的方式来取消事件冒泡行为。下列函数提供了两种方式取消事件冒泡:标准的W3C方式和非标准的IE方式。
function stopBubble(e){
//如果传入事件对象且支持W3C的stopPropagation的用法
if(e && e.stopPropagation){
//即为非IE浏览器
e.stopPropagation();
}else{
//IE方式取消事件冒泡
window.event.cancelBubble=true;
}
在javascript中如何取消事件冒泡的更多相关文章
- 学习javaScript必知必会(4)~事件、事件绑定、取消事件冒泡、事件对象
1.常用的事件: ① onload:页面加载 ② onblur: 失去焦点 onfocus: 获取焦点 ③ onclick:点击 ④ onmouseover:鼠标经过 onmouseout:鼠标离开 ...
- jQuery 取消事件冒泡 阻止后续内容执行 闭包函数 (学习笔记)
1.取消事件冒泡 <title>取消事件冒泡</title> <style> div { border:solid 1px black; } </style& ...
- 理解JavaScript中的事件处理 阻止冒泡event.stopPropagation();
原文地址:http://www.cnblogs.com/binyong/articles/1750263.html 这篇文章对于了解Javascript的事件处理机制非常好,将它全文转载于此,以备不时 ...
- jquery取消事件冒泡的三种方法(推荐)
1.通过返回false来取消默认的行为并阻止事件起泡. jQuery 代码: ? 1 2 3 4 5 6 7 8 9 10 11 $("form").bind( "s ...
- JavaScript高级程序设计笔记 事件冒泡和事件捕获
1.事件冒泡 要理解事件冒泡,就得先知道事件流.事件流描述的是从页面接收事件的顺序,比如如下的代码: <body> <div> click me! </div> & ...
- js 取消事件冒泡
html部分 <input type="button" id="btn1" value="按钮" /> <div id=& ...
- JS——取消事件冒泡,实现div的显示与隐藏 event.cancelBubble = true;
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- jquery取消事件冒泡的三种方法展示
jquery取消事件冒泡的三种方法展示 html代码 <!doctype html> <html> <head> <meta charset="ut ...
- jquery取消事件冒泡和取消默认行为
$('button').click(functon(e){ /*code*/ e.stopPropagation();//取消事件冒泡 e.preventDefault();//取消默认行为 })
随机推荐
- Git中的文件状态和使用
(暂存区 即Index In Git) commit 到 local respository的内容,不想push,则使用git reset 将文件状态回转到staged|modified|unstag ...
- Notepad++隐藏的用法
Notepad++是一个非常强大的文本编辑器. 它里面有很多有用的插件. 我认为对我比较有帮助的一个是NppExporter.它可以将Notepad++中彩色的代码原样的复制到Word中. 想要获得彩 ...
- [ActionScript 3.0] AS3 绘制正二十面体(线条)
分析: 正二十面体共有12个顶点.30条棱,其20个面都是正三角形.每条棱所对应的弧度值为1.1071487177940904弧度,这个弧度值可通过求Math.sqrt(5)/5的反余弦值求得.正二十 ...
- java selenium 项目环境搭建(一)
1.使用jdk1.7版本.jdk下载,请再百度输入 jdk 1.7下载,环境配置参考
- Node.js异常处理
var log4js = require('log4js'); log4js.configure({ appenders: [ { type: 'console' }, { type: 'file', ...
- EF连接mysql数据库生成实体模型
声明:本人也是第一次用EF连接mysql生成实体模型 经过试验: mysql-connector-net-6.6.6 可以支持VS2012 mysql-connector-net-6.3.9 可以支持 ...
- 菜鸟-手把手教你把Acegi应用到实际项目中(8)-扩展UserDetailsService接口
一个能为DaoAuthenticationProvider提供存取认证库的的类,它必须要实现UserDetailsService接口: public UserDetails loadUserByUse ...
- JavaScript自己模仿jQuery的一点小代码
function seter(sId) { var obj = document.getElementById(sId); return new function () { ...
- junit模板方法模式应用
模板方法模式 定义: 定义一个操作中的算法骨架,而将一些步骤延伸到子类中去,使得子类可以不改变一个算法的结构,即可重新定义该算法的某些特定步骤.这里需要复用的是算法的结构,也就是步骤,而步骤的实现可以 ...
- DB2命令大全
1.1查看表空间 db2 list tablespaces show detail 1.2查看数据库的表死锁 方法一: 打开监控 db2 update monitor switches using ...