<pre name="code" class="html">事件会按照DOM层次结构像水泡一样不断向上直至顶端
解决方法:在事件处理函数中返回false，会对事件停止冒泡。

还可以停止元素的默认行为。例如：可以阻止a标签的提交


<!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>

<script type="text/javascript" src="jquery-1.11.1.js"></script>

<script type="text/javascript">

	$(function (){

		/**

		 * 事件会按照DOM层次结构像水泡一样不断向上直至顶端

		 * 解决方法:在事件处理函数中返回false，会对事件停止冒泡。

		 * 还可以停止元素的默认行为。例如：可以阻止a标签的提交

		 */

		$("body").click(function (){

			alert("body");

		});

		$("div").click(function (){

			alert("div");

			return false;

		});

		$("span").click(function (){

			alert("span");

			return false;

		});

	});

</script>

</head>

<body>

	<div style="width:400px;height:100px;background:#CCC;">

		<span style="margin:auto;width:200px;height:50px;background:yellow;">事件冒泡</span>

	</div>

</body>

</html>
												


											
在jQuery中解决事件冒泡问题的更多相关文章
	

    
								
  1. jquery 中的事件冒泡
		
    废话少说,先来一段代码热热身: <!DOCTYPE html> <html> <head> <title>demo</title> < ...
    
		
    2. 
						
  2. jQuery中的事件冒泡
		
    1.什么是冒泡 eg: <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <he ...
    
		
    3. 
						
  3. JQuery中阻止事件冒泡的两种方式及其区别
		
    JQuery 提供了两种方式来阻止事件冒泡. 方式一:event.stopPropagation(); $("#div1").mousedown(function(event){  ...
    
		
    4. 
						
  4. JQuery中阻止事件冒泡方式及其区别
		
    JQuery 提供了两种方式来阻止事件冒泡. 方式一:event.stopPropagation();         $("#div1").mousedown(function( ...
    
		
    5. 
						
  5. 关于JQuery中的事件冒泡
		
    什么是事件冒泡? 事件冒泡就是当父元素和子元素存在同一事件时在子元素的事件处理程序中会自动调用其父级元素的事件处理程序. demo: <!DOCTYPE html> <html xm ...
    
		
    6. 
						
  6. 你知道JQuery中的事件冒泡吗，他是怎么执行的，如何来停止冒泡事件？
		
    事件冒泡 首先需要知道什么是事件冒泡? 事件冒泡是从里面的往外面开始触发的,就是点击子节点,会向上触发父节点,祖先节点的点击事件 demo: <html xmlns="http://w ...
    
		
    7. 
						
  7. jQuery 中的事件冒泡和阻止默认行为
		
    1.事件冒泡 <%@ page language="java" import="java.util.*" pageEncoding="utf-8 ...
    
		
    8. 
						
  8. 【jQuery】jQuery中的事件捕获与事件冒泡
		
    在介绍之前,先说一下JavaScript中的事件流概念.事件流描述的是从页面中接受事件的顺序.   一.事件冒泡( Event Bubbling)            IE 的事件流叫做事件冒泡,即 ...
    
		
    9. 
						
  9. jquery中怎样防止冒泡事件
		
    jquery中怎样防止冒泡事件 1.利用event.stopPropagation() 2.利用return false 3.利用event.preventDefault()
    
		
    10. 
		

	


随机推荐
	

    
									
  1. [转]ASP.NET MVC 5 - 给数据模型添加校验器
			
    在本节中将会给Movie模型添加验证逻辑.并且确保这些验证规则在用户创建或编辑电影时被执行. 拒绝重复 DRY ASP.NET MVC 的核心设计信条之一是DRY: "不要重复自己(DRY  ...
    
			
    2. 
						
  2. Java精选笔记_Java API
			
    String类 String类的初始化 String是一个特殊的对象,一旦被初始化,就不会被改变 1.使用字符串常量直接初始化一个String对象 String  s1="abc" ...
    
			
    3. 
						
  3. swift学习笔记之---数组、字典、枚举、结构体
			
    1.数组-Array let types = ["none","warning","error"] //省略类型的数组声明 let menb ...
    
			
    4. 
						
  4. docker search 详解
			
    docker search 用于从 Docker Hub(https://hub.docker.com)中搜索指定的镜像,用法如下: [root@localhost ~]$ docker search ...
    
			
    5. 
						
  5. 第十六篇：初探IO复用
			
    前言 在之前的文章中,我具体实现了一个并发回射服务器并给它加载了僵尸子进程的自动清理信号机制.在正常情况下,它已经可以很好地工作了,但它能否合理应对一些特殊情况呢? 问题发现 先来看看当服务器的客户子 ...
    
			
    6. 
						
  6. date类型数据插入
			
    --字段类型是dateinsert into tab(column) values(to_date('2017_06_30 11:38:22','yyyy-mm-dd hh24:mi:ss'));-- ...
    
			
    7. 
						
  7. poj_3067 树状数组
			
    题目大意 左右两个竖排,左边竖排有N个点,从上到下依次标记为1,2,...N; 右边竖排有M个点,从上到下依次标记为1,2....M.现在从K条直线分别连接左边一个点和右边一个点,求这K条直线的交点个 ...
    
			
    8. 
						
  8. css3-巧用选择器 “:target”
			
    今天(昨天)又发现一个知识盲区 css3的:target标签,之前学习的时候就是一眼扫过,说是认识了,但其实也就记了三分钟,合上书就全忘光了. 直到昨天,遇到一个有意思的题目,用css3新特性做一个类 ...
    
			
    9. 
						
  9. LeetCode——Valid Anagram
			
    Description: Given two strings s and t, write a function to determine if t is an anagram of s. For e ...
    
			
    10. 
						
  10. 微信Tinker的一切都在这里，包括源码(一)
			
    版权声明:本文由张绍文原创文章,转载请注明出处: 文章原文链接:https://www.qcloud.com/community/article/101 来源:腾云阁 https://www.qclo ...
    
			
    11.