event.cancelBubble=true
<tr><a href="xxx">连接</a></tr>
如上结构,单击tr的时候跳转至另一页面
<tr style="cursor:pointer" onmouseover="this.style.backgroundColor='gainsboro'" onmouseout="this.style.backgroundColor=''" onclick="return Click();"> |
function Click() { window.location.href = "xxx";} |
<a href="xxx">连接</a> 可更改为<a href="xxx" onclick="event.cancelBubble=true">连接</a>
这样可以避免单击a标签的同时也跳转至另一页面。onclick="event.cancelBubble=true" 取消事件处理。
否则单击a的同时会跳转另一页面。
解析:
取消事件冒泡,在 IE 的事件机制中,触发事件会从子元素向父元素逐级上传,就是说,如果子元素触发了单击事件,那么也会触发父元素的单击事件;event.cancelBubble=true;可以停止事件继续上传
补充一点,Ie的事件传递是从下到上的:
事件来源对象->上级对象->上上级对象->.....->body->document->window
NS的事件传递是从上到下:
window->document->body->....->事件来源对象
(event.returnValue=false 设置事件的返回值为false,即取消事件处理)
来自:http://www.cnblogs.com/wjmo520/archive/2013/01/15/2860814.html
event.cancelBubble=true的更多相关文章
- JS——取消事件冒泡,实现div的显示与隐藏 event.cancelBubble = true;
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- 【转载】设置event.cancelBubble,使触发子元素的onclick不同时触发父元素的onclick
由于HTML中的对象都是层次结构,比如一个Table包含了多个TR,一个TR包含了多个TD Bubble就是一个事件可以从子节点向父节点传递,比如鼠标点击了一个TD,当前的event.srcEleme ...
- js的stopPropagation()、cancelBubble、preventDefault()、return false的分析
个人笔记,如有错误,望指出. 事件冒泡,举个列子: <li> <a href='http://www.baidu.com'>点击a</a> </li> ...
- javascript event(事件对象)详解
javascript event(事件对象)详解 1. 事件对象 1. 事件对象 Event 对象代表事件的状态,比如事件在其中发生的元素.键盘按键的状态.鼠标的位置.鼠标按钮的状态. 什 ...
- javascript event兼容性随笔
一.前言 function ConvertEvent(e, element) { var event = e || window.event; var resultEvent = { event: e ...
- 添加事件及Event对象的兼容写法
一.事件流 事件流描述的是从页面中接受事件的顺序. IE的事件流是事件冒泡流,而Netscape的事件流是事件捕获流 1.事件冒泡 事件冒泡,即事件最开始由最具体的元素(文档中嵌套层次最深的那个节点) ...
- window.event对象详尽解析
event代表事件的状态,例如触发event对象的元素.鼠标的位置及状态.按下的键等等. event对象只在事件发生的过程中才有效. event的某些属性只对特定的事件有意义.比如,fromEleme ...
- JavaScript 中的window.event代表的是事件的状态,jquery事件对象属性,jquery中如何使用event.target
http://wenda.haosou.com/q/1373868839069215 http://kylines.iteye.com/blog/1660236 http://www.cnblogs. ...
- JS的event对象--知识点总结
Event描述:event代表事件的状态,例如触发event对象的元素.鼠标的位置及状态.按下的键等等. 需要注意的是:event对象只在事件发生的过程中才有效. event的某些属性只对特定的事件有 ...
随机推荐
- MySQL 简洁 数据操作 增删改查 记不住的 看这里把
1.库操作====================== 1.创建 CREATE DATABASE DB2 charset utf8; 2.删除 DROP DATABASE db2; 3.使用(进入) ...
- 112th LeetCode Weekly Contest Validate Stack Sequences
Given two sequences pushed and popped with distinct values, return true if and only if this could ha ...
- Spring 操作 jdbc 链接数据库
1. 新建资源文件 db.properities jdbc.user=root jdbc.password=root jdbc.driverClass=com.mysql.jdbc.Driver jd ...
- CAPL编程实现诊断刷写,车联网FOTA流程自动化测试(方案篇)
原创内容,转载请注明出处 本文围绕车联网的ECU,TBOX的FOTA升级业务展开描述.主要讲如何通过CANoe编程实现自动化测试, 验证TBOX在FOTA业务过程中作为一个诊断仪刷写整车其它ECU的流 ...
- kindeditor<=4.1.5文件上传漏洞
最近发现很多网页篡改与暗链都是利用kindeditor编辑器,于是搜了一下kindeditor的漏洞,发现低于4.1.5版本的存在文件上传的漏洞,可以上传txt,html后缀的文档,许多恶意的文档貌似 ...
- RESTful 设计工具和Web框架
搭建开发环境几乎都搭建失败,因为需要FQ Spring Boot 和 Spring MVC 单独 Jersey官网可以直接访问 https://jersey.java.net/documentatio ...
- Java基础22-Static关键字
1.static关键字 public class Test{ public static void main(String[] args){ Persion p1=new Persion(); Per ...
- poi 多行合并
poi做多行合并,一定需要先绘制单元格,然后写入数据,最后合并,不然各种坑啊. 合并单元格所使用的方法: sheet.addMergedRegion( CellRangeAddress cellRa ...
- 腾讯刘金明:腾讯云 EB 级对象存储架构深度剖析及实践
欢迎大家前往腾讯云+社区,获取更多腾讯海量技术实践干货哦~ 演讲者:刘金明 腾讯云存储业务中心副总监 背景:5月23-24日,以"焕启"为主题的腾讯"云+未来" ...
- Win10新建分区
今天忽然觉得将系统分为四个盘,有点无法将分类分开,所以增加了几个分区: 1.windows+X键在弹出的对话框中选择磁盘管理,进入如下界面: 2.如果你想从某个盘分出一些内存建立一个新的分区,就在这个 ...