jQuery阻止冒泡和HTML默认操作
1:jQuery是一个快捷简便的JavaScript框架,说道框架可以直接理解为就是对原来底层的东西进行了封装使得开发者能够利用这个框架快速开发。
2:在当今的各个浏览器中都支持事件的冒泡,所谓的冒泡可以这样理解:
事件:现在我们都在这两个元素上绑定相同的事件,比如click事件。
结果:这时,当我们点击内层的P标签的时候,内层元素的click事件触发,同时外层DIV的click事件也会触发。
3:在HTML中有的元素被定义了一些默认的属性,比如说A元素,这个元素就是我们平时使用的超链接标签,这个标签的默认属性是实现页面的跳转。
4:在jQuery的每一个事件中都会有一个默认的对象作为该事件的参数(但是必须显示地被指定),这个对象就是event对象,它包含了一些属性和方法,用于不同的场合。如下:
$('p:first').click(function(event){
//event对象可以使用了
});
5:有时我们不希望冒泡或默认的事件发生,这样就需要一些jQuery的的方法阻止冒泡和默认的事件了。可以通过以下三种方法做到不同程度的阻止。
A:return false --->In event handler ,prevents default behavior and event bubbing 。
return false 在事件的处理中,可以阻止默认事件和冒泡事件。
B:event.preventDefault()---> In event handler ,prevent default event (allows bubbling) 。
event.preventDefault()在事件的处理中,可以阻止默认事件但是允许冒泡事件的发生。
C:event.stopPropagation()---> In event handler ,prevent bubbling (allows default behavior).
event.stopPropagation()在事件的处理中,可以阻止冒泡但是允许默认事件的发生。
代码如:
$('input:submit').click(function(){return false;//去掉试试效果
})
jQuery阻止冒泡和HTML默认操作的更多相关文章
- js阻止冒泡事件及默认操作
1. 事件目标 现在,事件处理程序中的变量event保存着事件对象.而event.target属性保存着发生事件的目标元素.这个属性是DOM API中规定的,但是没有被所有浏览器实现 .jQuery对 ...
- jquery阻止冒泡事件行为发生
<div onclick="a()"> <p onclick="b()"></p> </div> div和p元素 ...
- jquery 阻止冒泡事件和阻止默认事件
jQuery 冒泡和默认事件: <!DOCTYPE html> <html lang="en"> <head> <meta charset ...
- JQuery阻止冒泡事件on绑定中异常情况分析
科普下事件冒泡以及默认行为,以下面例子举列子: 事件冒泡:当点击内部button元素时,会触发自身及外层 a的点击事件,这就是事件冒泡引起的.事件会随着 DOM 的层次结构依次向上传播. 事件 ...
- 【笔记】jquery阻止冒泡事件发生的语句
时间触发时会执行两个步骤:1.捕获 2.冒泡,而很多浏览器包括jquery都不支持捕获动作所以只能执行冒泡动作. 所谓冒泡就是当点击就是事件的执行顺序,本人的理解为:但某一元素触发时间时它的祖先元素( ...
- jQuery 阻止冒泡和默认事件
jQuery event.preventDefault() 方法 event.preventDefault() 方法阻止元素发生默认的行为. 例如: 当点击提交按钮时阻止对表单的提交 阻止以下 URL ...
- jquery阻止冒泡和阻止默认事件
event.stopPropagation(); event.preventDefault(); http://www.cnblogs.com/qixuejia/archive/2013/10/10/ ...
- jquery阻止冒泡事件:$('span').bind("click",function(event){event.stopPropagation();})(有用源)
冒泡事件就是点击子节点,会向上触发父节点,祖先节点的点击事件. <body> <div id="content"> 外层div元素 <span> ...
- js阻止冒泡事件和默认事件的方法
阻止默认事件 function stopDeFault(e){ if(e&&e.preventDefault){//非IE e.preventDefault(); }else{//IE ...
随机推荐
- 网络IPC:套接字
网络进程间通信(network IPC):不同计算机(通过网络相连)上运行的进程相互通信的机制. 套接字网络IPC接口:进程能够使用该接口和其他进程通信.通过该接口,其他进程运行位置是透明的,它们可以 ...
- Apache Shiro Architecture--官方文档
原文地址:http://shiro.apache.org/architecture.html Apache Shiro's design goals are to simplify applicati ...
- ReactNative 大图手势浏览技术分析
支持通用的手势缩放,手势跟随,多图翻页 手势系统 通过 PanResponder.create 创建手势响应者,分别在 onPanResponderMove 与 onPanResponderRelea ...
- Django单元测试二三事
零.前言 之前做过一个微信公众平台的开发者后台,功能比较简单,我个人也比较懒,所以就没有写测试.前段时间更新了一下版本,对代码进行了改动.结果昨天收到消息说后台出问题了,一个功能无法使用.我检查了半天 ...
- Log4Net(三)之记录日志到数据库
前面两篇短文向大家介绍了如何使用log4net,以及如何将log4net记录到文本文件中.下面本文将向大家介绍如何将log4net记录到数据库中. 经过前面的介绍,我想大家对使用log4net的过程已 ...
- 如何删除C/C++源代码中的注释
具体代码: #include <stdlib.h> #include <stdio.h> //删除注释 void commentFilter(FILE* sourceFi ...
- AI 对不起 我还爱着你
艾弗森,对不起,我还爱着你.有时候我自己都不知道自己我怎么了,直到最后才发现,我还爱着你. 那天起,我认识了你,便一发不可收拾.这些天,谢谢你,似乎因为你的影响让我改变了,坚持了许多.致以至今我才发现 ...
- 【转】uvm 与 system verilog的理解
http://www.cnblogs.com/loves6036/p/5779691.html 数字芯片和FPGA的验证.主要是其中的功能仿真和时序仿真. 验证中通常要搭建一个完整的测试平台和写所需要 ...
- C# Distinct方法的使用笔记
引自:http://blog.csdn.net/shaopengfei/article/details/36426763 从C# 3.0开始提供了Distinct方法,这对于集合的使用有了更为丰富的方 ...
- mdeditor
*在线地址:* http://ghosertblog.github.io/mdeditor/ # Markdown 语法简明手册 ### 1. 使用 * 和 ** 表示斜体和粗体 示例: 这是 *斜体 ...