Javascript 事件冒泡
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
</head>
<body>
<div>
<span></span>
<ul>
<li>nextSibling</li>
<li>nextSibling</li>
<li>nextSibling</li>
<li>nextSibling</li>
<li>nextSibling</li>
</ul>
</div>
<script type="text/javascript">
window.onload = function () { };
function next(ele) {
if (typeof ele.nextElementSibling == 'object') {
return ele.nextElementSibling;
}
var n = ele.nextSibling;
while (n) {
if (n.nodeType == 1) {
return n;
}
n = n.nextSibling;
}
return n;
}
function fn(e) {
e = e || window.event;
if (e.stopPropagation) {
e.stopPropagation();
} else {
e.cancelBubble = true;
} if (e.stopPropagation()) {
e.stopPropagation();//标准浏览器阻止默认方式
} else {
e.returnValue = false;//IE的组织默认行为
}
} function fn2() {
alert(this.nodeName);
}
var ele = document.getElementsByTagName('li');
for (var i = 0; i < ele.length; i++) {
ele.item(i).addEventListener('click', fn2, false);
} document.body.addEventListener("click", fn2, false); document.body.addEventListener('click', fn, true); document.addEventListener('click', fn, true); //内到外 冒泡 IE支持
//外到内 捕获 IE不支持
</script>
</body>
</html>
Javascript 事件冒泡的更多相关文章
- 解析Javascript事件冒泡机制
本资源引自: 解析Javascript事件冒泡机制 - 我的程序人生 - 博客频道 - CSDN.NET http://blog.csdn.net/luanlouis/article/details/ ...
- 转:JavaScript事件冒泡简介及应用
(本文转载自别处) JavaScript事件冒泡简介及应用 一.什么是事件冒泡 在一个对象上触发某类事件(比如单击onclick事件),如果此对象定义了此事件的处理程序,那么此事件就会调用这个处理 ...
- JavaScript事件冒泡和事件委托
JavaScript事件冒泡和事件委托 付建宇 - 2 条评论 接触JavaScript不久,学的东西也不是特别多.小雨就是习惯把平时学到的东西拿出来分享.一方面加强自己的印象,一方面可以让自己的经验 ...
- JavaScript事件——冒泡、捕获
本节要点:1.干预系统的事件处理机制 (一)DOM事件流 (二)停止事件冒泡 (三)阻止事件的默认行为 1.干预系统的事件处理机制 (一)DOM事件流 DOM模型是一个树形结构,在DOM模型中,HTM ...
- Javascript事件冒泡机制
1. 事件 在浏览器客户端应用平台,基本生都是以事件驱动的,即某个事件发生,然后做出相应的动作. 浏览器的事件表示的是某些事情发生的信号.事件的阐述不是本文的重点,尚未了解的朋友,可以访问W3scho ...
- JavaScript事件冒泡简介及应用
一.什么是事件冒泡 在一个对象上触发某类事件(比如单击onclick事件),如果此对象定义了此事件的处理程序,那么此事件就会调用这个处理程序,如果没有定义此事 件处理程序或者事件返回true,那么这个 ...
- javascript事件冒泡
1. 事件 在浏览器客户端应用平台,基本生都是以事件驱动的,即某个事件发生,然后做出相应的动作. 浏览器的事件表示的是某些事情发生的信号.事件的阐述不是本文的重点,尚未了解的朋友,可以访问W3scho ...
- 解析Javascript事件冒泡机制(转) 本文转自:http://blog.csdn.net/luanlouis/article/details/23927347
本文转自:http://blog.csdn.net/luanlouis/article/details/23927347 1. 事件 在浏览器客户端应用平台,基本生都是以事件驱动的,即某个事件发生,然 ...
- JavaScript事件冒泡机制和阻止事件冒泡及默认事件
一.阻止事件冒泡: 1.html中加return false 2.js中加return false 3.IE下:window.event.cancelBubble = true: FF下:event ...
- 解析Javascript事件冒泡机制(转)
本文转自:http://blog.csdn.net/luanlouis/article/details/23927347 1. 事件 在浏览器客户端应用平台,基本生都是以事件驱动的,即某个事件发生,然 ...
随机推荐
- Mybatis 中常用的java类型与jdbc类型
JDBC Type Java Type CHAR String VARCHAR String LONGVARCHAR String NUMERIC java.math.BigDecimal DECIM ...
- .net mvc通过ucenter和 discuz的整合,nopcommerce ucenter 插件的方式实现
discuz无疑是目前市面上最好的论坛之一,对于大多数公司来说,用discuz搭建一个论坛肯定是最节约成本的选择,然而我们的会员想要和discuz进行整合的话,只有两种荀泽,一种直接选用discuz的 ...
- [Linq Expression]练习自己写绑定
源代码:TypeMapper.zip 背景 项目中,我们会经常用到各种赋值语句,比如把模型的属性赋值给UI,把视图模型的属性拷贝给Entity.如果模型属性太多,赋值也会变成苦力活.所以,框架编程的思 ...
- OA项目实战(二) 开发准备
上次的博文OA系统实践(一) 概述中,我们已经了解了OA的相关概念.从本次博文开始,我们做一个简单的OA实例. 在OA开发之前,有几个工作们需要提前做.一个是对需求进行分析,另一个是对开发环境进行选择 ...
- [shell基础]——split命令
测试文本 # cat name1.txt name1 alvin1 name2 alvin2 name3 alvin3 name4 alvin4 此时目录下就只有这个文件 # ls name1.txt ...
- Android Paint的使用以及方法介绍(附源码下载)
要绘图,首先得调整画笔,待画笔调整好之后,再将图像绘制到画布上,这样才可以显示在手机屏幕上.Android 中的画笔是 Paint类,Paint 中包含了很多方法对其属性进行设置,主要方法如下: se ...
- SQL Server Reporting Services – Insufficient Rights Error
http://www.sql-server-performance.com/2011/security-ssrs-reporting-error/ SQL Server Reporting Servi ...
- GCC常用命令行一览表
GCC常用命令行一览表 这些常用的 gcc/g++ 命令行参数,你都知道么?1. gcc -E source_file.c-E,只执行到预编译.直接输出预编译结果. 2. gcc -S source_ ...
- android 怎么动态设置button 的style
网上找了很多,还是没有直接的解决办法,button没有setstyle这个方法.因此我的解决办法如下: 直接动态设置各个属性 Button themeBtn = new Button(this); t ...
- ZBar之自定义二维码扫描
// // YvanQRCodeViewController.m // zBar // // Created by City--Online on 15/6/8. // Copyright (c) 2 ...