jquery中事件冒泡 - 腾讯云开发者社区 - 腾讯云

开发者社区

文档建议反馈控制台

文章/答案/技术大牛

发布

Jquery 事件冒泡

什么是JS事件冒泡？...（摘自网络）如何来阻止Jquery事件冒泡？...事件冒泡 jquery-1.3.2-vsdoc.js" type="text/javascript"> ...，阻止了事件冒泡，但不会阻击默认行为（它就执行了超链接的跳转） 2.return false; 事件处理过程中，阻止了事件冒泡，也阻止了默认行为（比如刚才它就没有执行超链接的跳转）还有一种有冒泡有关的...会发现它依次弹出：我是最里层---->我是中间层---->我是最外层，但最后却没有跳转到百度它的作用是：事件处理过程中，不阻击事件冒泡，但阻击默认行为（它只执行所有弹框，却没有执行超链接跳转）

3.9K7 0

jquery 事件冒泡、阻止事件冒泡 - event.stopPropagation()

事件冒泡的作用事件冒泡允许多个操作被集中处理（把事件处理器添加到一个父级元素上，避免把事件处理器添加到多个子级元素上），它还可以让你在对象层的不同级别捕获事件。...事件冒泡的示例编写三个嵌套的div，同时绑定click事件，来演示事件冒泡。 ?...设置了阻止冒泡传递之后，那么click()事件就不会传递到father和grandfather的事件，所以只有一个alert()弹出。完整事件冒泡示例代码 jquery-3.4.0....合并阻止操作实际开发中，一般把阻止冒泡和阻止默认行为合并起来写，合并写法可以用 // event.stopPropagation(); // event.preventDefault(); // 合并写法

7.3K4 1

您找到你想要的搜索结果了吗？

是的

没有找到

jquery取消元素默认冒泡事件

取消默认冒泡事件的三种方式 1.通过返回false来取消默认的行为并阻止事件起泡 $(element).click(function(){ return false; }) 2.通过使用preventDefault...$(element).click(function(e){ e.preventDefaule(); }) 3.通过使用stopPropagation()方法阻止事件起泡 $(element).click

1.8K2 0

jquery - 页面弹框 - 阻止事件冒泡示例

解决#btn的事件冒泡，使用return false; ? 在阻止了#btn按钮的click()事件冒泡到$(document)之后，那么弹框就可以正常显示了。...这个思路不涉及事件冒泡的阻止，但是属于同一个click()方法的阻止，因为点击$(document)的click()事件应该不会冒泡到它下面的元素.pop，不过可以在这里验证一下。...执行完毕了alert()的事件之后，就继续冒泡将click()方法至下而上得冒泡至$(document)，导致$(document)执行fadeOut()。...在这个验证的过程中，更加确认了刚才在.pop使用return false;的确是用来阻止click()的冒泡至$(document)的。...写到这里基本已经演示完了关于事件冒泡的弹框示例了。完整代码 <!

4.5K1 0

JQuery IE下如何阻止keydown事件冒泡

2.解决思路: 比如可以把button换掉；阻止keydown事件的默认行为preventDefault等。...浏览器　　e.preventDefault(); //阻止默认浏览器动作(W3C) } else { //IE中阻止函数器默认动作的方式　　...window.event.returnValue = false; } return false; } 2.停止事件冒泡 function stopBubble...的stopPropagation()方法 } else { //否则，我们需要使用IE的方式来取消事件冒泡　　window.event.cancelBubble = true; ...，则这是一个非IE浏览器　　e.preventDefault(); //阻止默认浏览器动作(W3C) } else { //IE中阻止函数器默认动作的方式

2.2K3 0

jquery中使用event.stopPropagation()阻止事件冒泡

因为按钮在文档内，所以会产生事件冒泡使得在点按钮打开菜单时无法正常执行。所以我们需要阻止事件冒泡。例子代码如下： <!...green;} span{display:block;width:100px;height:30px;background-color:skyblue;} jquery.js...class="box">消失的盒子 //点span显示盒子 $("span").click( function(){ event.stopPropagation()//阻止事件冒泡

1.3K13 0

jQuery：详解jQuery中的事件（一）

jQuery不仅提供了更加优雅的事件处理语法，而且极大的增强了事件处理能力。　　...一、jQuery中的事件　　1、加载DOM：　　执行时机：在常规的JavaScript中，通常使用window.onload方法，而在jQuery中，使用的是$(document).ready()方法...要解决这个问题，可以使用jQuery中的另一个关于页面加载的方法——load()方法。load()方法会在元素的onload事件中绑定一个处理函数。...第二个参数是可选参数，作为event.data属性值传递给事件对象的额外数据对象。第三个参数则是用来绑定的处理函数。举个实际的例子，下面网页中，单击“标题”链接将显示内容。　　...明天继续完成jQuery事件的下半部分，包括的内容有合成事件、事件冒泡、移除事件等内容。

3.5K2 0

jQuery：详解jQuery中的事件（二）

上一篇讲到jQuery中的事件，深入学习了加载DOM和事件绑定的相关知识，这篇主要深入讨论jQuery事件中的合成事件、事件冒泡和事件移除等内容。　　...接上篇jQuery：详解jQuery中的事件（一）　　3、合成事件　　jQuery有两个合成事件——hover()方法和toggle()方法，同ready()方法一样，这些都是jQuery自定义的方法...就上面的简单描述，已经可以看出问题所在了，那就是会出现意想不到的click事件，所以需要对事件作用范围进行限制。　　jQuery有三种办法可以解决事件冒泡导致的问题。...这个事件对象只有事件处理函数才能访问到。事件处理函数执行完毕后，事件对象就被销毁。　停止事件冒泡：停止事件冒泡可以阻止事件中其他对象的事件处理函数被执行。...在jQuery中提供了stopPropagation()方法来停止事件冒泡。

4.6K3 0

nvue中tap事件取消冒泡

——拉罗什富科 nvue中@tap.stop阻止冒泡失效了代码如下：触发触发大概有两种方案，第一种是改事件，改为@touchend事件触发触发</view

1.7K1 0

FLEXFLASH-冒泡事件与非冒泡事件

1){ Event.EventData = "内部按钮"; btn1.dispatchEvent(Event);//将事件分派到事件流中...else{ Event.EventData = "外部按钮"; btn2.dispatchEvent(Event);//将事件分派到事件流中...刷新页面点击“外部BTN” 结果如图所示因为事件的引发者没有在panl1中所以不会再触发panel1的事件了以上说的都是非冒泡事件，事件的执行顺序是从外层容器到内层容器执行的 5....是false 这样设置后就是冒泡事件，事件的执行顺序是从内层容器到外层容器执行的 6....如果即要捕捉非冒泡事件，又要捕捉冒泡事件那么创建事件的代码为 var Event:btnEvent1=new btnEvent1(btnEvent1.EVENT_NAME,true);//最后一个参数

1.3K1 0

事件冒泡，阻止事件冒泡 e.stopPropagation()

/jquery-1.11.0.min.js" type="text/javascript"> ...-- li在ul里，ul在div中，只要点击了li，也就是点击了ul,也就是点击了div。...在上面的函数中，先弹出 “我是li”然后弹出“我是ul”，最后弹出“我是div” 一层一层的冒泡，而阻止冒泡的方式就是调用事件的对象来调用stopPropagation()方法。...单机tree时，会同时触发two，然后触发one 2.如果在click事件中，在你要处理的事件之前加上e.preventDefault(); 　那么就取消了行为（通俗理解：相当于做了个return操作）...3.e.stopPropagation()只要在click事件中，就不会触发上层click事件。

2.9K3 0

as3.0中如何阻止事件冒泡?

as3.0中的事件冒泡机制有时候会很烦人，比如一个Sprite(方便下文描述就命名为Container吧)把另一外Sprite(称为Child吧)做为子元素套进来以后，如果两个Sprite都注册了Mouse_Down...事件，要想在Child上点击鼠标时系统只响应Child的Mouse_Down事件，默认是不行的，因为事件冒泡会让Container也响应Mouse_Down事件，示例代码： package { import...Adobe总不至于傻到弄二个功能一样的东东吧官方的解释： stopImmediatePropagation():void 防止对事件流中当前节点中和所有后续节点中的事件侦听器进行处理。 ...stopPropagation():void 防止对事件流中当前节点的后续节点中的所有事件侦听器进行处理。...，stopPropagation将把该事件注册的所有监听处理函数执行完后，再阻止该事件继续向上冒泡；而stopImmediatePropagation方法将本次处理函数执行完后就立即阻止事件继续向上冒泡

2.2K6 0

js事件冒泡

什么是冒泡？ DOM事件流（event flow ）存在三个阶段：事件捕获阶段、处于目标阶段、事件冒泡阶段。...事件冒泡**（***dubbed bubbling***）**：与事件捕获恰恰相反，事件冒泡顺序是由内到外进行事件传播，直到根节点。...dom标准事件流的触发的先后顺序为：先捕获再冒泡，即当触发dom事件时，会先进行事件捕获，捕获到事件源之后通过事件传播进行事件冒泡。...参数 useCapture 是选填的，填true或者false，用于描述事件是冒泡还是捕获，true表示捕获，默认的false表示冒泡。...stopPropagation()方法 } else { window.event.cancelBubble = true; //否则，我们需要使用IE的方式来取消事件冒泡

14.5K4 2

jQuery第二十四篇事件冒泡和默行为

-1.10.1.min.js"> $(function() { //“冒泡事件:微软提出的事件由子元素传递到父元素的过程...,叫做冒泡” //但是在实际项目开发中，我们可能并不需要元素的默认行为，所以就可以通过以下方式进行禁止。...$(".son").click(function(event) { // return false;//不仅阻止了事件往上冒泡，而且阻止了事件本身。...event.stopPropagation();//则只阻止事件往上冒泡，不阻止事件本身。...}); //“冒泡事件:微软提出的事件由子元素传递到父元素的过程,叫做冒泡” //但是在实际项目开发中，我们可能并不需要元素的默认行为，所以就可以通过以下方式进行禁止。

5611 0

事件冒泡与事件捕获

javascript 的事件捕获和事件冒泡之前一直没能弄明白，知道看到一个例子。...点击可查看示例去示例中试一试便清楚了~ 处理事件理解了事件的捕获和冒泡机制，对于事件处理就好办了。...阻止默认事件 event.preventDefault() // 阻止事件默认动作，比如阻止 submit 按钮默认提交 event.stopPropagation() // 阻止捕获和冒泡阶段中事件的进一步传播...，比如是在‘石头’下沉或者‘气泡’冒泡的过程中使之突然消失事件代理：从上面事件机制可以看出，如果没有外部干扰，在子节点上触发的事件，在捕获和冒泡最终都会经过父节点因此，我们可以将事件处理函数绑定在父节点上面...这样做的好处一个是可以不关心子元素是同步还是异步的另一个是如果有多个子元素，可以不用绑定多个事件（在异步列表 click 事件中很常见）。

2.4K1 0

前端-part9-jQuery操作样式二：元素追加+事件冒泡

的前面 $(A).before(B); // 把 B 放到 A 的前面 $(A).insertBefore(B); // 把 A 放到 B 的前面 5.移除和清空元素 remove() // 从 DOM 中删除所有匹配的元素...span> 登录 jquery...// 妈的，学你妈的前端啊，心真累... } ); setInterval(f, 10) 11.关于事件的冒泡...content-Type" charset="UTF-8"> 我的事件冒泡...function(event){ alert("儿子辈的"); event.stopPropagation() // 阻止事件向上级冒泡

2.5K3 0

js --- 事件冒泡事件捕获

先上结论：　　他们是描述事件触发时序问题的术语。事件捕获指的是从document到触发事件的那个节点，即自上而下的去触发事件。相反的，事件冒泡是自下而上的去触发事件。...绑定事件方法的第三个参数，就是控制事件触发顺序是否为事件捕获。true,事件捕获；false,事件冒泡。默认false,即事件冒泡。...Jquery的e.stopPropagation会阻止冒泡，意思就是到我为止，我的爹和祖宗的事件就不要触发了。...事件的触发顺序自内向外，这就是事件冒泡。...事件触发顺序变更为自外向内，这就是事件捕获。方法：阻止事件冒泡和默认行为。事件冒泡：　 ? 　　阻止默认行为： ?

16.1K2 0

jquery中各个事件应用实例

jquery_shijian_function.html... jquery.js">

1.1K6 0

从零开始学 Web 之 jQuery（七）事件冒泡，事件参数对象，链式编程原理

一、事件冒泡与阻止事件冒泡事件冒泡：当一个元素触发某个事件的时候，会把这个事件传播到其父元素，一直到顶层元素。阻止事件冒泡：在被触发事件的子元素中添加 return false; 即可。...二、事件的触发之前讲的绑定事件是事件触发后的事件处理过程，并且上面的事件触发是被动的事件触发，怎么可以主动触发事件呢？...// 鼠标按下的键值 e.button // 按键按下的键值 e.keyCode // 触发该事件的目标对象，是一个 DOM 对象 // 当发生事件冒泡的时候，可以定位到具体发生事件的源对象，而不是冒泡的对象...还有一个问题，就是 jQuery 中 val(); 在没有参数时时读取数值，不能链式编程；在有参数的时候是设置，可以链式编程。...☆ ☆ ☆ ☆ jquery

1.1K4 0

JS事件冒泡与事件捕获

在JavaScript中，我们将事件发生的顺序称为“事件流”，当我们触发某个事件时，会发生一些列的连锁反应，例如有如下所示的一段代码：事件捕获与事件冒泡合并，也就是现在的“先捕获后冒泡”，如下图所示：图：事件捕获与事件冒泡事件捕获在事件捕获阶段，事件会从 DOM 树的最外层开始，依次经过目标节点的各个父节点...elem.addEventListener("click", showTagName, true); } 运行上面的代码，单击最内层的标签，运行结果如下图所示：图：事件捕获演示事件冒泡事件冒泡正好与事件捕获相反...，运行结果如下图所示：图：事件冒泡演示阻止事件捕获和冒泡了解了事件捕获和事件冒泡后会发现，这个特性并不友好，例如我们在某个节点上绑定了事件，本想在点击时触发这个事件，结果由于事件冒泡，这个节点的事件被它的子元素给触发了...() 会阻止事件捕获和事件冒泡，但是无法阻止标签的默认行为，例如点击链接任然可以打开对应网页。

3371 0

点击加载更多

相关资讯

热门标签

活动推荐

运营活动

活动名称

广告关闭