jQuery preventDefault() ,stopPropagation(),stopImmediatePropagation()
preventDefault()
函数用于阻止当前触发事件的默认行为。
在HTML文档中,当我们触发某些DOM元素的特定事件时,可以执行该元素的默认行为。比如链接的click
事件:当我们点击一个链接时,就会跳转到指定的URL。再比如:<form>表单元素的submit
事件,当我们触发表单的提交事件时,就可以提交当前表单。
stopImmediatePropagation()
函数用于阻止剩余的事件处理函数的执行,并防止当前事件在DOM树上冒泡。
根据DOM事件流机制,在元素上触发的大多数事件都会冒泡传递到该元素的所有祖辈元素上,如果这些祖辈元素上也绑定了相应的事件处理函数,就会触发执行这些函数。
使用stopImmediatePropagation()
函数可以阻止当前事件向祖辈元素的冒泡传递,也就是说该事件不会触发执行当前元素的任何祖辈元素的任何事件处理函数。
此外,与event.stopPropagation()函数相比,stopImmediatePropagation()
函数还会阻止该元素剩余的其他事件处理函数的执行。
此外,由于live()函数并不是将事件处理函数直接绑定到自己身上,而是"委托"绑定到祖辈元素上,由祖辈元素来触发执行。live()函数会先一次性冒泡到文档的顶部,然后为符合条件的元素触发事件。因此,stopImmediatePropagation()
函数无法阻止live事件的冒泡。
同样地,delegate()函数也是"委托事件函数",只有事件冒泡传递到"受委托"的祖辈元素才会被触发执行。因此,stopImmediatePropagation()
函数无法阻止该元素到"受委托"的祖辈元素之间的事件冒泡。
stopPropagation()
函数用于阻止当前事件在DOM树上冒泡。
根据DOM事件流机制,在元素上触发的大多数事件都会冒泡传递到该元素的所有祖辈元素上,如果这些祖辈元素上也绑定了相应的事件处理函数,就会触发执行这些函数。
使用stopPropagation()
函数可以阻止当前事件向祖辈元素的冒泡传递,也就是说该事件不会触发执行当前元素的任何祖辈元素的任何事件处理函数。
该函数只阻止事件向祖辈元素的传播,不会阻止该元素自身绑定的其他事件处理函数的函数。event.stopImmediatePropagation()不仅会阻止事件向祖辈元素的传播,还会阻止该元素绑定的其他(尚未执行的)事件处理函数的执行。
此外,由于live()函数并不是将事件处理函数直接绑定到自己身上,而是"委托"绑定到祖辈元素上,由祖辈元素来触发执行。live()函数会先一次性冒泡到文档的顶部,然后为符合条件的元素触发事件。因此,stopPropagation()
函数无法阻止live事件的冒泡。
同样地,delegate()函数也是"委托事件函数",只有事件冒泡传递到"受委托"的祖辈元素才会被触发执行。因此,stopPropagation()
函数无法阻止该元素到"受委托"的祖辈元素之间的事件冒泡。
原文地址:http://www.365mini.com/page/jquery-event-preventdefault.htm
jQuery preventDefault() ,stopPropagation(),stopImmediatePropagation()的更多相关文章
- How to correctly use preventDefault(), stopPropagation(), or return false; on events
How to correctly use preventDefault(), stopPropagation(), or return false; on events I’m sure this h ...
- preventDefault stopPropagation??
棒棒哒~ event.preventDefault https://developer.mozilla.org/zh-CN/docs/Web/API/Event/preventDefault stop ...
- jquery preventDefault()方法 语法
jquery preventDefault()方法 语法 作用:preventDefault() 方法阻止元素发生默认的行为(例如,当点击提交按钮时阻止对表单的提交).大理石平台价格 语法:event ...
- perventDefault, stopPropagation, stopImmediatePropagation 三者的区别
event有三种特别容易混淆的方法, 用来阻止默认事件的发生 1. e.preventDefault(); 2. e.stopPropagation(); 3. e.stopImmediatePro ...
- jQuery Event.stopPropagation() 函数详解
stopPropagation()函数用于阻止当前事件在DOM树上冒泡. 根据DOM事件流机制,在元素上触发的大多数事件都会冒泡传递到该元素的所有祖辈元素上,如果这些祖辈元素上也绑定了相应的事件处理函 ...
- preventDefault, stopPropagation, return false -JS事件处理中的坑
我们以一个文件上传ui重设计为例子来探讨这几个函数的区别: 其中的html代码如下: <div class="file-upload"> <input type= ...
- stopPropagation / stopImmediatePropagation
stopPropagation()只会阻止冒泡或者是捕获. stopImmediatePropagation()会阻止该元素的其他事件发生,但是stopPropagation就不会阻止其他事件的发 ...
- jquery preventDefault() 方法防止打开不是本站的链接URL
将以下代码保存为test.html,用浏览器打开即可测试 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN&q ...
- jquery preventDefault()事件
定义和用法 preventDefault() 方法阻止元素发生默认的行为(例如,当点击提交按钮时阻止对表单的提交). 语法 event.preventDefault() 参数 描述 event 必需. ...
随机推荐
- 【转帖】介绍 .NET Standard
[译]介绍 .NET Standard https://zhuanlan.zhihu.com/p/24267356 跟开发争执过 自己不会写代码 的确不好. 若有任何对翻译的建议,烦请指正 有任何问题 ...
- Day 5-8 自定义元类控制类的实例化行为
__call__方法: 对象后面加括号,触发执行. 注:构造方法的执行是由创建对象触发的,即:对象 = 类名() :而对于 __call__ 方法的执行是由对象后加括号触发的,即:对象() 或者 类( ...
- CART算法与剪枝原理
参考:https://blog.csdn.net/u014688145/article/details/53326910 知乎:https://www.zhihu.com/question/22697 ...
- 生成统计数据并导出Excel
需求:看如下表格的统计需求 生产调度中心部门需要从IT技术部门得到这些统计数据 步骤: (1)获取所有的子公司列表 (2)遍历所有的子公司,获取每个子公司的库存信息 (3)遍历所有的库存信息,并对库存 ...
- JavaScript控制阻止表单提交
1.在表单上使用onSubmit方法 <?php $form = ActiveForm::begin([ 'options'=>[ 'class' => 'form-horizont ...
- DataSet 取值,DataSet行数,DataSet列数 从DataSet中取出特定值
1 DataSet.Table[0].Rows[ i ][ j ] 其中i 代表第 i 行数, j 代表第 j 列数 2 DataSet.Table[0].Rows[ i ].ItemArray[ j ...
- solr配置ik中文分词(二)
上一篇文章主要介绍了solr的安装与配置,这篇文章主要记录如何使用ik分词器对中文进行分词. 步骤: 1.下载ik分词jar包:ik-analyzer-solr5-5.x.jar. 2.将下载的jar ...
- 使用JAVA获取JSON报文
基本JSON格式: { "name": "liming", "age": "13", "array" ...
- Java多线程之线程状态转换图
说明:线程共包括以下5种状态.1. 新建状态(New) : 线程对象被创建后,就进入了新建状态.例如,Thread thread = new Thread().2. 就绪状态(Runn ...
- 神烦之float
另外一篇文章 : css float 一 历史 Float的设计初衷仅仅是:文字环绕效果(向word中的文字环绕效果) 二 特性 1.包裹性:块级元素如果不设置float,它默认会撑满整个屏幕,而如果 ...