<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

<title>在此处插入标题</title>

<style>

#div1 {

    width: 400px;

    height: 400px;

    background-color: red;

}

#div2 {

    width: 300px;

    height: 300px;

    background-color: green;

}

#div3 {

    width: 200px;

    height: 200px;

    background-color: blue;

}

</style>

<script language='javascript' src='../jQuery/jquery.js'></script>

<script>

    $().ready(function() {

        //点击事件 div1

        $('#div1').bind('click', function() {

            alert('div1');

        });

        //点击事件 div2

        $("#div2").bind("click", function(event) {

            alert('div2');

            event.stopPropagation();

        });

        //点击事件 div3

        $("#div3").bind("click", function(event) {

            alert('div3');

            //弹出消息框后，取消事件冒泡

            event.stopPropagation();

        });

    });

</script>

</head>

<body>

    <div id='div1'>

        <div id='div2'>

            <div id='div3'></div>

        </div>

    </div>

</body>

</html>

需要  jquery.js 自己引入

jquery 事件冒泡 解决 ie firefox 兼容性问题的更多相关文章

  1. jquery 事件冒泡的介绍以及如何阻止事件冒泡

    在一个对象上触发某类事件(比如单击onclick事件),如果此对象定义了此事件的处理程序,那么此事件就会调用这个处理程序,如果没有定义此事件处理程序或者事件返回true,那么这个事件会向这个对象的父级 ...

  2. jquery mouseout事件冒泡解决方法

    在界面中最多使用的是div,如果一个div中包含多个div或img对象时, 针对mouseout鼠标移出事件时,并没有移出div层,但是当移动到div中的img时,也触发了该mouseout事件,这就 ...

  3. jQuery 事件冒泡

    1 . 什么是冒泡 在页面上可以有多个事件,也可以多个元素响应同一个事件.假设网页上有两个元素,其中一个元素嵌套在另一个元素里,并且都被绑定了 click 事件,同时<body>元素上也绑 ...

  4. 阻止jQuery事件冒泡

    Query对DOM的事件触发具有冒泡特性.有时利用这一特性可以减少重复代码,但有时候我们又不希望事件冒泡.这个时候就要阻止 jQuery.Event冒泡. 在jQuery.Event 的文档 中的开头 ...

  5. Jquery 事件冒泡、元素的默认行为的阻止、获取事件类型、触发事件

    $(function(){// 事件冒泡 $('').bind("click",function(event){ //事件内容 //停止事件冒泡 event.stopPropaga ...

  6. Jquery事件冒泡

    事件冒泡 什么是事件冒泡 在一个对象上触发某类事件(比如单击onclick事件),如果此对象定义了此事件的处理程序,那么此事件就会调用这个处理程序,如果没有定义此事件处理程序或者事件返回true,那么 ...

  7. jquery——事件冒泡、事件委托

    一个事件冒泡的例子: <!DOCTYPE html> <html lang="en"> <head> <meta charset=&quo ...

  8. jquery hover事件冒泡解决方法

    $(this).hover(function(event){    $(this).addClass("cur");    event.stopPropagation();     ...

  9. 事件冒泡及事件委托的理解（JQuery Dom操作）

    jQuery事件冒泡: click mouseenter 等事件没有绑定 也会触发,只是触发后没有任何结果 子元素触发事件后,会把触发事件传递给父元素,那么父元素也会被触发. 不管有没有绑定事件,都会 ...

随机推荐

  1. 得分（Score,ACM/ICPC Seoul 2005,UVa 1585)

    #include<stdio.h> int main(void) { char b; int t,cou,sum; scanf("%d",&t); getcha ...

  2. [LeetCode] Word Ladder II

    Given two words (start and end), and a dictionary, find all shortest transformation sequence(s) from ...

  3. bootstrap 新手学习笔记 代码整理

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  4. Bootstrap 新手学习笔记——布局组件

    1.字形图标: <button type="button" class="btn btn-primary btn-lg" style="font ...

  5. 【VNC】Linux环境VNC服务安装、配置与使用

     [VNC]Linux环境VNC服务安装.配置与使用 2009-06-25 15:55:31 分类: Linux   前言:作为一名DBA,在创建Oracle数据库的过程中一般要使用dbca和netc ...

  6. ASP.NET MVC学习笔记-----使用自定义的View Engine

    我们都知道在ASP.NET MVC中自带了Razor View Engine,Razor十分的强大,可以满足我们绝大部分的需要.但是ASP.NET MVC的高度可扩展性,使我们可以使用自定义的View ...

  7. Web SQL数据库

    Web SQL数据库:它是一个独立的规范,引入了一组使用SQL操作客户端数据库的API. openDatabase方法:这个方法使用现有的数据库或者新建的数据库创建一个数据库对象.如果数据库存在,op ...

  8. 序列化.to_sym

    <%= link_to t('links.list'), showable_paths[@subchannel_item.showable_type.to_sym], target: '_bla ...

  9. magic-encoding

    (文章都是从我的个人主页上粘贴过来的,大家也可以访问我的主页 www.iwangzheng.com) 今天页面跳转都出问题了,各种方法都试过了, log里说语法错误,问了pp,他说是汉字的原因...果 ...

  10. MySQL 如何只导出 指定的表 的表结构和数据 （ 转 ）

    MySQL 如何只导出 指定的表 的表结构和数据 ( 转 ) 2011-01-04 15:03:33 分类: MySQL MySQL 如何只导出 指定的表 的表结构和数据 导出更个库的表结构如下:my ...