位置：首页>> 网络编程>> JavaScript>> JavaScript事件冒泡

JavaScript事件冒泡

　来源：Ruby's Louvre　发布时间：2009-12-28 13:21:00　

标签：事件,冒泡,JavaScript

检测submit事件的冒泡情况：

<!doctype html><html dir="ltr" lang="zh-CN" onsubmit="alert('能冒泡到html元素')"> <head id="head"> <meta charset="utf-8"/> <title>事件冒泡 by司徒正美</title> </head> <body onsubmit="alert('能冒泡到body元素')"> <div onsubmit="alert('能冒泡到form元素的父元素')"> <form onsubmit="alert('能冒泡到form元素')"> <button type="submit">提交</button> <input type="submit" value="提交"> </form> </div> </body></html>

IE6	IE8	FF3.6	opera10	chrome4	safari4
冒泡到FORM	冒泡到FORM	冒泡到HTML	冒泡到HTML	冒泡到HTML	冒泡到HTML

检测reset事件的冒泡情况：

<!doctype html><html dir="ltr" lang="zh-CN" onreset="alert('能冒泡到html元素')"> <head id="head"> <meta charset="utf-8"/> <title>事件冒泡 by司徒正美</title> </head> <body onreset="alert('能冒泡到body元素')"> <div onreset="alert('能冒泡到form元素的父元素')"> <form onreset="alert('能冒泡到form元素')"> <button type="submit">重设</button> <input type="reset" value="重设"> </form> </div> </body></html>

IE6	IE8	FF3.6	opera10	chrome4	safari4
冒泡到FORM	冒泡到FORM	冒泡到HTML	冒泡到HTML	冒泡到FORM	冒泡到FORM

检测change事件的冒泡情况：

以下元素都能发生onchange事件：input（文本域），select，textarea。

<!doctype html><html dir="ltr" lang="zh-CN" onchange="alert('能冒泡到html元素')"> <head id="head"> <meta charset="utf-8"/> <title>事件冒泡 by司徒正美</title> </head> <body onchange="alert('能冒泡到body元素')"> <div onchange="alert('能冒泡到div元素')"> <form onchange="alert('能冒泡到form元素')"> <select onchange="alert('select发生onchange事件')"> <option>司徒正美</option> <option>司徒正美2</option> <option>司徒正美3</option> </select> </form> </div> </body></html>

IE6	IE8	FF3.6	opera10	chrome4	safari4
不冒泡	不冒泡	冒泡到HTML	冒泡到HTML	不冒泡	不冒泡

1

0

投稿

猜你喜欢

W3C Group的JavaScript1.8新特性介绍
在了解了JavaScript1.7的相关更新后，我们再继续关注JavaScript1.8的新特性。在W3C Group带来的JavaScri
解析SQL Server数据体系和应用程序逻辑
在许多用SQL Server实现的新的企业系统设计中，系统设计师需要在给数据结构和管理应用程序逻辑的定位上做出具有关键性意义的决定。SQL
客户端数据存储–超越cookies
说到客户端数据存储，可能第一时间想到的是cookies，这是一种网站常见的存储数据的方法。它的最大优点是兼容性好，几乎所有浏览器都具有这个功
WEB前端开发经验总结 Ⅰ
很久没有写文章，最近一直在忙于找工作和找房子。哎，现在终于安定下来了，哎，又叹息一下，是因为我把去淘宝面试的机会也推掉了，本来以为要卷铺盖回
什么是UE，UED？
一、什么是用户体验？用户体验的名词解释用户体验（User Experience，简称UE）是一种纯主观的在用户使用一个产品（服务）的过程中建
浏览器用户体验：Firefox初体验 VS The world
听说firefox是史上最好用的浏览器，便下载下来体验一番，将体验感受与大家分享一下，并和我一直使用的the world浏览器做一个对比!首
oracle命令行删除与创建用户
oracle命令删除用户：connect / as sysdba; shutdown abort; startup;&n
小白讲座：在win下mysql备份恢复命令概括
假设mysql 安装在c：盘，mysql数据库的用户名是root，密码是123456，数据库名是database_name，在d：盘根目录下
Sql Server 数据库超时问题的解决方法
1.由于数据库设计问题造成SQL数据库新增数据时超时症状:Microsoft OLE DB Provider for SQL Server
VBScript中清除数组元素Erase语句
Erase语句：重新初始化固定数组的元素，并释放动态数组的存储空间。用法： Era
javaScript通用数据类型校验函数
本文介绍了一些JavaScript常用到得表单验证函数，方便大家使用。判断是否为整数，是则返回true,否则返回falsefun
OBJECTPROPERTY与sp_rename更改对象名称的介绍
开发过程中，错误免不了。为了纠正错误与规范化。可以使用MS SQL Server的系统存储过程sp_rename与OBJECTPROPERT
谈谈图片如何影响转换率
你喜欢在博客文章中使用图片吗？是的，如果不是很麻烦的话，相信大家都不会介意放上几张漂亮的图片来点缀一下内容的，不过你的图片可能会导致下面的两
Perl下应当如何连接Access数据库
首先需要安装Win32-ODBC模块，具体的步骤如下：1：从TOOLS栏目中下载Win32-ODBC.zip,下载完后用winzip解开到一
你是一个职业的页面重构工作者吗？
做为一个专职的页面重构者，我们从事的工作简单的说就是“将设计稿转换成WEB页面”，这一过程可以很简单到直接把PSD从里导出成网页；也可复杂
chr(9)、chr(10)、chr(13)、chr(32)与特殊空格
chr(13) 是一个回车Chr(10) 是一个换行符chr
GC与JS内存泄露
Javascript有没有内存泄露？如果有，如何避免？鉴于最近有好几个人问到我类似的问题，看来大家对这部分内容还没有系统的研究过，因此，打算
css网页下拉菜单制作方法(2):初步实现
内容摘要：模拟网页下拉菜单中有几个比较关键的CSS属性：position、left、top、
asp如何做一个随机密码产生器？
如何做一个随机密码产生器？<％genPassword = ""RandomizeFor&nbs
sql语句返回主键SCOPE_IDENTITY()
在sql语句后使用 SCOPE_IDENTITY() 当然您也可以使用 SELECT @@IDENTITY 但是使用 SELECT @@ID

ajax标签导航实例详解教程

静态页面分页的AJAX实现

AJAX缓存问题的两种解决方法(IE)

javascript面向对象技术基础(三)

在IE下获取object（ActiveX）的Param

js金额浮点格式化控件

新浪微博文字渐隐效果

JavaScript奇怪的比较——隐式类型转换

FCKeditor 编辑器实战技巧 Ⅰ

javascript基础之indexOf函数

编写一个JS组件来说说call和apply的用法

zblog博客实现代码高亮显示（插件）方法

写出完美CSS代码的5个重要方面

提高google adsense的点击次数经验

ftp操作常识问题集锦

PS制作Blue风格非主流

rs.open sql,conn,1,1与rs.open sql,conn,1.3还有rs.open sql,conn,3,2区别

网站SEO详解链接策略与搜索引擎优化

IE9报“DOM Exception: INVALID_CHARACTER_ERR (5)”错误的原因及解决办法

写在2008年的母亲节

手机版 网络编程 asp之家 www.aspxhome.com