js 事件监听 冒泡事件
js 事件监听 冒泡事件 的取消
【自己写框架时，才有可能用到】
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>事件编程</title>
<style type='text/css'> #div1 {
width:400px;
height:400px;
background:#ff0000;
}
#div2 {
width:300px;
height:300px;
background:blue;
}
#div3 {
width:200px;
height:200px;
background:yellow;
}
</style> <script>
//取消事件冒泡 //自己写框架时，才有可能用到
function stopBubble(event) {
if(window.event) {
window.event.cancelBubble = true;
} else {
event.stopPropagation();
}
}
window.onload = function() {
addEvent($('div1'),'click',function(){
alert('div1');
})
addEvent($('div2'),'click',function(event){
alert('div2');
stopBubble(event);
})
addEvent($('div3'),'click',function(event){
alert('div3');
stopBubble(event);
})
}
</script>
</head>
<body>
<div id='div1'>
<div id='div2'>
<div id='div3'></div>
</div>
</div>
</body>
</html>
js 事件监听 冒泡事件的更多相关文章
- [JS]笔记12之事件机制--事件冒泡和捕获--事件监听--阻止事件传播
-->事件冒泡和捕获-->事件监听-->阻止事件传播 一.事件冒泡和捕获 1.概念:当给子元素和父元素定义了相同的事件,比如都定义了onclick事件,点击子元素时,父元素的oncl ...
- JS 中的事件绑定、事件监听、事件委托
事件绑定 要想让 JavaScript 对用户的操作作出响应,首先要对 DOM 元素绑定事件处理函数.所谓事件处理函数,就是处理用户操作的函数,不同的操作对应不同的名称. 在JavaScript中,有 ...
- JS 事件绑定、事件监听、事件委托详细介绍
原:http://www.jb51.net/article/93752.htm 在JavaScript的学习中,我们经常会遇到JavaScript的事件机制,例如,事件绑定.事件监听.事件委托(事件代 ...
- JS 中的事件绑定、事件监听、事件委托是什么？
在JavaScript的学习中,我们经常会遇到JavaScript的事件机制,例如,事件绑定.事件监听.事件委托(事件代理)等.这些名词是什么意思呢,有什么作用呢? 事件绑定 要想让 JavaScri ...
- javascript事件监听与事件委托
事件监听与事件委托 在js中,常用到element.addEventListener()来进行事件的监听.但是当页面中存在大量需要绑定事件的元素时,这种方式可能会带来性能影响.此时,我们可以用事件 ...
- js事件监听机制(事件捕获)总结
在前端开发过程中我们经常会遇到给页面元素添加事件的问题,添加事件的js方法也很多,有直接加到页面结构上的,有使用一些js事件监听的方法,由于各个浏览器对事件冒泡事件监听的机制不同,le浏览器只有事件冒 ...
- js事件监听机制(事件捕获)
在前端开发过程中我们经常会遇到给页面元素添加事件的问题,添加事件的js方法也很多,有直接加到页面结构上的,有使用一些js事件监听的方法,由于各个浏览器对事件冒泡事件监听的机制不同,le浏览器只有事件冒 ...
- JS事件流、事件监听、事件对象、事件委托
JS事件流: 01.DOM级别和DOM事件 02.JS事件流:页面中接收事件的顺序 事件冒泡阶段-->处于目标阶段-->事件捕获阶段 (事件捕获总发生在事件冒泡前面) 03.捕获:从外向里 ...
- js input监听兼容事件
$('#phoneNumber').on('input',function() { var valueP = $(this).attr('value'); if(valueP.length == 11 ...
随机推荐
- Metasploit自动攻击和选择模块攻击详解
Author:魔术@Freebuf.com 0×1自动攻击 终端启动Metasploit,因为我现在Source Code,所以这样启动! 连接数据库 安装方法,执行以下命令即可(请用ROOT执行). ...
- C# 反射创建对象,包括创建引用外部程序集类的实例
#region 根据对象名成创建对象 /// <summary> /// 根据对象名成创建对象 /// </summary> /// <param name=" ...
- CentOS创建免密码SSH（密钥）
1.输入以下命令:ssh-keygen -t rsa 2.输入命令ls:产生两个文件:id_rsa id_rsa.pub 3.复制id_rsa.pub,并命名为authorized_key cp ~/ ...
- liunx几台机器直接用ssh链接
1,查看ip sudo ifconfig 2,查看是否安装了ssh server服务 ps -ef |grep ssh 或者ps -aux |grep ssh 看一下里面有没有sshd.如果没有表示 ...
- tomcat服务器配置及使用
序:tomcat作为免费开源的web服务器,广受大家喜欢,但是该如何使用此服务器呢?下面就一步一步教大家操作tomcat服务器 一.权限配置 编辑tomcat-users.xml文件配置tomcat服 ...
- MySQL 5.6 Warning: Using a password on the command line interface can be insecure
MySQL 5.6 在命令行输入密码,就会提示这些安全警告信息. Warning: Using a password on the command line interface can be inse ...
- DLL注入之SetWindowsHookEx
注:本文章转载自网络 函数功能:该函数将一个应用程序定义的挂钩处理过程安装到挂钩链中去,您可以通过安装挂钩处理过程来对系统的某些类型事件进行监控,这些事件与某个特定的线程或系统中的所有事件相关. 函数 ...
- 《第一行代码》（三： Android 百度地图 SDK v3.0.0）
百度地图的SDK变化较大,第一行代码里的demo已经不能用了,一直以为是代码类错误,害我花了很多时间,可以参考这位博主的:http://blog.csdn.net/lmj623565791/artic ...
- ZeroMQ(java)之Router/Dealer模式
本教程转自:http://blog.csdn.net/kobejayandy/article/details/20163527 在开始之前先把guid里面提到的几个ZeroMQ的特性列一下吧: (1) ...
- win7/ubuntu双系统下，如何恢复成win7引导及卸载ubuntu
电脑原来是win7系统,后来通过硬盘安装了Ubuntu,同时把Ubuntu设置成了开机引导项(开机时选择操作系统的界面成了紫色背景白色字体的界面),ubuntu引导开机的缺点是将来要卸载Ubuntu时 ...