如果在页面中重叠了多个元素,并且重叠的这些元素都绑定了同一个事件,那么就会出
现冒泡问题。

//HTML 页面

<div style="width:200px;height:200px;background:red;">
<input type="button" value="按钮" />
</div>
//三个不同元素触发事件
$('input').click(function () {
alert('按钮被触发了!');
}); $('div').click(function () {
alert('div 层被触发了!');
}); $(document).click(function () {
alert('文档页面被触发了!');
});

jQuery 提供了一个事件对象的方法:event.stopPropagation();这个方法设置到需要触发
的事件上时,所有上层的冒泡行为都将被取消。

$('input').click(function (e) {
alert('按钮被触发了!');
e.stopPropagation();
});

jquery的冒泡和默认行为的更多相关文章

  1. jQuery 阻止冒泡和默认事件

    jQuery event.preventDefault() 方法 event.preventDefault() 方法阻止元素发生默认的行为. 例如: 当点击提交按钮时阻止对表单的提交 阻止以下 URL ...

  2. jquery,禁止冒泡和默认行为

    如果在页面中重叠了多个元素,并且重叠的这些元素都绑定了同一个事件,那么就会出现冒泡问题.//HTML 页面<div style="width:200px;height:200px;ba ...

  3. jQuery阻止冒泡和HTML默认操作

    1:jQuery是一个快捷简便的JavaScript框架,说道框架可以直接理解为就是对原来底层的东西进行了封装使得开发者能够利用这个框架快速开发. 2:在当今的各个浏览器中都支持事件的冒泡,所谓的冒泡 ...

  4. jQuery event,冒泡,默认事件用法

    jQuery event,冒泡,默认事件用法 <%@ page language="java" import="java.util.*" pageEnco ...

  5. jquery 阻止冒泡事件和阻止默认事件

    jQuery 冒泡和默认事件: <!DOCTYPE html> <html lang="en"> <head> <meta charset ...

  6. js阻止冒泡和默认事件(默认行为)详解- jquery DefaultPrevented 函数

    <!DOCTYPE html> <html>     <head>     <meta charset="UTF-8">     & ...

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

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

  8. JQuery阻止冒泡事件on绑定中异常情况分析

    科普下事件冒泡以及默认行为,以下面例子举列子:     事件冒泡:当点击内部button元素时,会触发自身及外层 a的点击事件,这就是事件冒泡引起的.事件会随着 DOM 的层次结构依次向上传播. 事件 ...

  9. jQuery 事件冒泡

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

随机推荐

  1. UVALive 6959 - Judging Troubles

    给两组字符串,最多有多少对相同. map做映射判断一下. #include <iostream> #include <cstdio> #include <map> ...

  2. 测试工具:insure++

    CSDN资源:http://www.csdn.net/tag/insure%252B%252B 安装. 1,简介:http://baike.baidu.com/link?url=bCcoWd3xi07 ...

  3. 使用jquery插件uploadify上传文件的方法与疑问

    我是学生一枚,专业也不是计算机,但又要用到很多相关技术,所以在技术基础不牢靠的情况下,硬着头皮在做.最近在做一个小项目需要上传图片,而且是需要用ajax的方式.但是利用jquery的ajax方法总会有 ...

  4. AJAX验证数据库内容并显示在页面

    功能实现: 在jsp页面中填写文本框内容,光标离开文本框,在本页面的相应地方获取数据库中改值所对应的其他数据. servlet: request.setCharacterEncoding(" ...

  5. MySQL的基本数据类型与数据类型优化

    1.选择优化的数据类型的标准 1)更小的通常更好. 一般情况下,应该尽量使用可以正确存储数据的最小数据类型.更小的数据类型通常更快,因为他们占用更少的磁盘.内存和CPU缓存,并且处理时需要的CPU周期 ...

  6. 为什么我们需要性能测试,需要loadrunner

    什么是功能: 功能按我理解就是软件实现需求,提供服务,那么功能测试就是实现的需求是否与客户给定需求一致,也就是符合预期结果 什么是性能: 功能是实现需求,提供服务,那么性能就可以理解为服务的好坏.比如 ...

  7. SemaphoreFullException when checking user role via ASP.NET membership

    将指定的计数添加到该信号量中会导致其超过最大计数 This issue was fixed by restarting ASP.NET Development Server on windows ta ...

  8. (Inno setup打包)检测系统是否已安装程序,若已安装则弹出卸载提示的代码

    原文 http://bbs.itiankong.com/thread-30983-1-5.html 有6天没研究pascal代码了,昨天晚上突然来了灵感,终于解决了苦思冥想好几天没能解决的问题, 因此 ...

  9. [转]Geoserver实现WFS操作

    From:http://liushaobo2005.blog.163.com/blog/static/253056702011541462372/ wfs是OGC的标准规范,主要用于提供对矢量地理数据 ...

  10. poj 1458 Common Subsequence_最长公共子串

    题意:略 求最长公共子串 #include<iostream> #include<cstdio> #include<string> using namespace ...