<!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. codejumper的跳转代码

    public void JumpToSource(vsCMPart location = vsCMPart.vsCMPartNavigate) { TextPoint startPoint = Ori ...

  2. Yii2事件

    namespace app\components; use yii\base\Component; use yii\base\Event; class MessageEvent extends Eve ...

  3. wireshark基本用法及过虑规则

     wireshark基本用法及过虑规则 标签: wireshark基本语法wireshark使用方法wireshark包过虑规则 2015-02-03 18:44 10711人阅读 评论(0) 收藏  ...

  4. linux kill信号列表

    linux kill信号列表 $ kill -l1) SIGHUP       2) SIGINT       3) SIGQUIT      4) SIGILL5) SIGTRAP      6) ...

  5. Linux for windows cp 数据中文乱码

    今天遇到一个很奇葩的问题,不仅让我纠结了半天更影响了我的工作效率找到了一种解决方法.分享和记录下以备自己和后人参考 说下情况 本人的Linux服务器上的数据要cp到新安装的windows server ...

  6. sh脚本学习之: sh脚本 、sed、awk

    sh脚本 sh命令的批处理文件,支持更复杂的逻辑. Shell中的变量 参数 $0 当前脚本路径 $1....$n 脚本执行对应的第n个参数 条件判断 文件判断 test [op] path e存在 ...

  7. 注意页面上的时间戳可能会成为bd快照的时间_快照不更新的原因

    之前在创建内容的时候,为了提高说服力,添加了一个原始文章的地址**.com.cn/2013-08/22/content_**.htm,当时写文章是在12月份,单快照直接变成原始文章的时间戳8.22

  8. HDU 4915 Parenthese sequence

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=4915 解题报告:从前往后遍历一次,每次判断')'的数目是不是满足 n < (i +1)/ 2,从 ...

  9. [Effective JavaScript 笔记]第26条：使用bind方法实现函数的柯里化

    bind方法的作用,除了有绑定函数到对象外,我们来看看bind方法的一些其它应用. 简单示例 例子:假设有一个装配URL字符串的简单函数.代码如下 function simpleURL(protoco ...

  10. 在CentOS 7 上搭建LAMP

    导读 要求:httpd的动态和静态资源分为两台主机提供,mysql也用单独一台主机.httpd服务提供虚拟主机,一个虚拟主机用于提供phpMyAdmin:另一个虚拟主机用于提供wordpress.安装 ...