JQuery 提供了两种方式来阻止事件冒泡。

方式一:event.stopPropagation();

$("#div1").mousedown(function(event){
            event.stopPropagation();
        });

方式二:return false;

$("#div1").mousedown(function(event){
            return false;
        });

但是这两种方式是有区别的。return false 不仅阻止了事件往上冒泡,而且阻止了事件本身。event.stopPropagation() 则只阻止事件往上冒泡,不阻止事件本身。

给checkbox增加阻止事件冒泡

$("input[type='checkbox']").click(function(e){  
            e.stopPropagation();   
        });

代码示例:

$(function(){
    $('.clickPic').click(function(){
        $(this).children('.bigpic').attr('src','bg0000012112126.png');
        $(this).children('.del').css('display','block');
    })
    
    $('.del').click(function(event){
        event.stopPropagation();
        $('.bigpic').attr('src','bg0000012112125.png');
        $(this).css('display','none');
    })
})

JQuery 提供了两种方式来阻止事件冒泡。的更多相关文章

  1. JQuery中阻止事件冒泡的两种方式及其区别

    JQuery 提供了两种方式来阻止事件冒泡. 方式一:event.stopPropagation(); $("#div1").mousedown(function(event){ ...

  2. 阻止事件冒泡两种方式:event.stopPropagation();和return false;

    jQuery提供了两种方式来阻止事件冒泡. 方式一:event.stopPropagation(); $("#div1").mousedown(function (event) { ...

  3. JQuery中阻止事件冒泡方式及其区别

    JQuery 提供了两种方式来阻止事件冒泡. 方式一:event.stopPropagation();         $("#div1").mousedown(function( ...

  4. js阻止冒泡及jquery阻止事件冒泡示例介绍

    js阻止冒泡 在阻止冒泡的过程中,W3C和IE采用的不同的方法,那么我们必须做以下兼容. 复制代码 代码如下: function stopPro(evt){ var e = evt || window ...

  5. jQuery阻止事件冒泡的例子

    下面给给各位朋友稍加整理了一jquery中阻止事件冒泡的一些例子,我们知道JQuery 提供了两种方式来阻止事件冒泡,但我们简单的利用它来做一些应用可能不深入或不理解,下面整理了更详细的方法,有兴趣的 ...

  6. JQuery 阻止事件冒泡

    JQuery 提供了两种方式来阻止事件冒泡. 方式一:event.stopPropagation(); $("#div1").mousedown(function(event){  ...

  7. sparkStreaming读取kafka的两种方式

    概述 Spark Streaming 支持多种实时输入源数据的读取,其中包括Kafka.flume.socket流等等.除了Kafka以外的实时输入源,由于我们的业务场景没有涉及,在此将不会讨论.本篇 ...

  8. guice基本使用,配置模块的两种方式(三)

    guice是使用module进行绑定的,它提供了两种方式进行操作. 第一种是继承AbstractModule抽象类. package com.ming.user.test; import com.go ...

  9. jQuery 获取DOM节点的两种方式

    jQuery中包裹后的DOM对象实际上是一个数组,要获得纯粹的DOM对象可以有两种方式: 1.使用数组索引方式访问,例如: var dom = $(dom)[0]; 如: $("#id&qu ...

随机推荐

  1. selenium之坑:点击后页面刷新重新获取刷新前的页面(StaleElementReferenceException:Message:Element not found in the cache...)

    循环点击一列链接,但只能点到第一个,第二个失败,这是为什么,因为第二个已经是新页面,当然找不到之前页面的元素,虽然元素没变,甚至是后退回来,页面都没有变,为什么是新页面,页面长的一样不代表是同一张页面 ...

  2. Python 1 的数据类型

    Python3 中有六个标准的数据类型: Number(数字)String(字符串)List(列表)Tuple(元组)Sets(集合)Dictionary(字典) 1.Number(数字) pytho ...

  3. jdbc驱动jar导入eclipse

    在使用JDBC编程时需要连接数据库,导入JAR包是必须的,导入其它的jar包方法同样如此,导入的方法是 打开eclipse 1.右击要导入jar包的项目,点properties 2.左边选择java ...

  4. iOS 视图控制器转场动画/页面切换效果/跳转动画 学习

    一 学习 在 UINavigationController 中 push 和 pop 的转场效果  (基于iOS7 以上的转场方式) 经过学习了解到,重点分三块: (1)pushAnimation:  ...

  5. Shell编程基础及变量

    一.Shell脚本 1.Shell脚本的建立 由Linux命令.shell命令.程序结构控制语句和注释等内容组成. 脚本第一行 #!/bin/bash #!字符称为幻数,内核会根据它后面的解释器来确定 ...

  6. LVS/NAT 配置

    LVS/NAT 配置 实验环境 三台主机:Linux Centos 6.4 32位 调度器Director:192.168.1.160(内网IP).192.168.2.20(公网IP) HTTP真实服 ...

  7. Django源码剖析

    一.Django底层剖析之一次请求到响应的整个流程 As we all know,所有的Web应用,其本质上其实就是一个socket服务端,而用户的浏览器就是一个socket客户端 #!/usr/bi ...

  8. JSP--内置对象&动作标签介绍

    1.JSP中常用的9大内置对象? 内置对象:在JSP页面中能直接使用的对象就是JSP内置对象,事实上,JSP底层就是一个java类,可以在JSP中直接使用的,必然存在JSP翻译后的java类 下面简单 ...

  9. myeclipse 10 j安装了JDK1.7,java编译器无法选择到1.7的问题

    java程序编写,在eclipse中会自动编译,编译的版本在preferrence-->java-->compiler选择具体版本,这时你写程序时自动编译用的jdk就是这个版本的jdk,这 ...

  10. 关于Hystrix

    RPC远程调用过程中如何防止服务雪崩效用 微服务中如何保护服务 Hystrix是一个微服务中关于服务保护框架,在分布式中能够实现对服务容错.出错之后的预备方案 背景 在今天,基于SOA的架构已经大行其 ...