本文中，边肖整理了JS如何防止事件冒泡的相关知识点，有需要的朋友可以借鉴。
% @ Page Language=' c# ' AutoEventWireup=' true ' CodeFile=' default 5 . aspx . cs ' inherits=' default 5 ' %
！' DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.0 Transitional//EN ' ' http://www . w3 . org/TR/XHTML 1/DTD/XHTML 1-Transitional . DTD '
html xmlns=' http://www . w3 . org/1999/XHTML '
head runat='server '
TitlePorschev - Jquery事件冒泡/title
script src=' jquery-1 . 3 . 2-vs doc . js ' type=' text/JavaScript '/script
/头
身体
表单id='form1' runat='server '
Div id='divOne' onclick='alert('我是最外层')；'
Div id='divTwo' onclick='alert('我是中间层！')'
a=' HR _ three ' href=' http://www . Baidu . com ' rel=' external no follow ' rel=' external no follow ' MCE _ href=' 3358 www . Baidu . com ' rel=' external no follow ' rel=' external no follow ' onc)'点击我/a。
/div
/div
/表单
/body
/html
例如，上面这一页，
分为三层：divOne为外层，divTwo为中间层，hr_three为最内层；
它们都有自己的click事件，最里面的A标签也有href属性。
运行页面，点击“点击我”，依次弹出：我是最内层——我是中间层——我是最外层。
——然后链接百度。
这就是事件冒泡。本来我只点了ID为hr_three的标签，但是我确实进行了三次预警操作。
事件冒泡流程(用标签ID表示):HR _ three-divtwo-divone。从最里层泡到最外层。
怎么阻止？
1 . event . stop propagation()；
脚本类型='文本/javascript '
$(function() {
$('#hr_three ')。单击(功能(事件){
event . stop propagation()；
});
});
脚本
再点击“点击我”，会弹出：我是最里层，然后链接百度。
2 .返回false
如果将以下代码添加到标题中
脚本类型='文本/javascript '
$(function() {
$('#hr_three ')。单击(功能(事件){
返回false
});
});
脚本
再点击“点击我”，会弹出：我是最里层，但不会链接百度页面。
可以看出：
1.event.stopPropagation();
在事件处理过程中，事件被阻止冒泡，但默认行为没有被阻止(它执行超链接的跳转)。
2.return false;
在事件处理过程中，它防止事件冒泡和默认行为(例如，它只是不执行超链接跳转)。
还有一种与冒泡有关：
3.event.preventDefault();
如果你把它放在head A选项卡的click事件中，点击“点击我”。
会依次弹出：我是最内层——我是中间层——我是最外层，但是最后没有跳到百度。
它的作用是：在事件处理过程中，不阻塞事件冒泡，而是阻塞默认行为(只执行所有的子弹框，不执行超链接跳转)。
以上提到的知识点就这些了。谢谢你的支持。
郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。