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 必需. ...
随机推荐
- Azure系列2.1.2 —— BlobContainerProperties
(小弟自学Azure,文中有不正确之处,请路过各位大神指正.) 网上azure的资料较少,尤其是API,全是英文的,中文资料更是少之又少.这次由于公司项目需要使用Azure,所以对Azure的一些学习 ...
- Windows字符集安装
0. 获取字符集安装文件. 最简单的办法 上msdn i tell you 下载 多语言安装盘. 一般都比较大. 比如: 1. 进入windows10 操作系统. 运行输入: lpksetup 选择安 ...
- linux pstree命令
pstree命令可以使进程以tree的形式显示 pstree -ssystemd─┬─UVPHostd───6*[{UVPHostd}] ├─acpid ├─2*[agetty] ├─crond ├─ ...
- python 钉钉机器人发送消息
import json import requests def sendmessage(message): url = 'https://oapi.dingtalk.com/robot/send?ac ...
- PHPStorm从入门到精通
1. 使用phpstorm+xdebug进行调试 首先,安装php的xdebug扩展 查看phpinfo中php的版本,php的安装位数,php的是否线程安全:根据这些下载对应的xdebug.dll ...
- CSS 的三种样式 内联 内部 外部
CSS:层叠样式表的缩写 就是 Cascading Style Sheets Cascading Style Sheets : 层叠样式表 优先级问题 :遵守就近原则 内联> 内部>外部 ...
- orecal基本连接数据库简介
整理自互联网 一. jdbc:oracle:thin:@192.168.3.98:1521:orcljdbc:表示采用jdbc方式连接数据库oracle:表示连接的是oracle数据库thin:表示连 ...
- Graphics
Image img = Image.FromFile("g1.jpg");//建立Image对象Graphics g = Graphics.FromImage(img);//创建G ...
- DotNetty 实现 Modbus TCP 系列 (三) Codecs & Handler
本文已收录至:开源 DotNetty 实现的 Modbus TCP/IP 协议 DotNetty 作为一个半成品,我们不需要关注细节的实现,只需要关注自己的业务即可,所以最主要的就是处理 Codecs ...
- HttpRequest,WebRequest,HttpWebRequest,WebClient,HttpClient 之间的区别
HttpRequest,WebRequest,HttpWebRequest,WebClient,HttpClient 今天我们来聊一下他们之间的关系与区别. HttpRequest 类 .NET Fr ...