js事件冒泡与事件委托有关吗

2024-08-20

js事件冒泡和事件委托

js事件冒泡 js所谓的事件冒泡就是子级元素的某个事件被触发,它的上级元素的该事件也被递归执行 html: <ul class="clearfix" data-type="cityPick"> <li class="active_sort_opts" data-id="0">全部</li> <li data-id="88">纽约</li> <

转载请注明出处:http://www.cnblogs.com/zhangmingze/p/4864367.html ● 事件分为三个阶段: 事件捕获 --> 事件目标 --> 事件冒泡 ● 事件捕获:事件发生时(onclick,onmouseover……)首先发生在document上,然后依次传递给body.……最后到达目的节点(即事件目标). ● 事件冒泡:事件到达事件目标之后不会结束,会逐层向上冒泡,直至document对象,跟事件捕获相反 1.onlick -->

javascript的事件冒泡,阻止事件冒泡和事件委托，事件委托是事件冒泡的一个应用。

首先,弄明白js 当中,什么是事件,事件模型在js中是如何设计的.什么是事件冒泡? 什么是“事件冒泡”呢?假设这里有一杯水,水被用某种神奇的方式分成不同颜色的几层.这时,从最底层冒出了一个气泡,气泡会一层一层地上升,直到最顶层.而你不管在水的哪一层观察都可以看到并捕捉到这个气泡.好了,把“水”改成“DOM”,把“气泡”改成“事件”.这就是“事件冒泡” 什么是事件委托呢?event delegation : 地址:http://davidwalsh.name/event-delegate One

事件冒泡、事件委托、jQuery元素节点操作、滚轮事件与函数节流

一.事件冒泡定义事件冒泡是指在一个对象触发某类事件(比如单击onclick事件),如果此对象定义了此事件的处理程序,那么此事件就会调用这个处理程序,如果没有定义此事件处理程序或者事件返回true,那么这个事件会向这个对象的父级对象传播,从里到外,甚至它被处理(父级对象所有同类事件都将被激活),或者它到达了对象层级的最顶层,即document对象(有些浏览器是window).. 二.事件冒泡的作用事件冒泡允许多个操作被集中处理(把事件处理器添加到一个父级元素上,避免把事件处理器添加到多个子级元

【JavaScript】事件捕获、事件冒泡与事件委托

2018年12月18日最近在学习js时,遇到了三个名词:事件捕获.事件冒泡.事件委托. 一.事件捕获和事件冒泡事件捕获和事件冒泡是为了解决网页中的事件流(事件发生的顺序)而提出的概念. 事件捕获是指事件会从开始发生,直到最具体的元素. 而事件冒泡正好相反,就如同将石子投入水中,波纹是从中心向两边散开.事件冒泡是指事件会从最内层的元素开始发生,一直向外传播. 例: <div id="outer"> <p id="inner">Click m

JavaScript事件冒泡和事件委托

JavaScript事件冒泡和事件委托付建宇 - 2 条评论接触JavaScript不久,学的东西也不是特别多.小雨就是习惯把平时学到的东西拿出来分享.一方面加强自己的印象,一方面可以让自己的经验为他人答疑解惑.我们知道JavaScript可以监控页面上元素的各种事件,常用的事件有很多,例如点击,鼠标移入.移出,元素改变等等.这次主要说一下事件冒泡及其一个比较酷的应用,事件委托.不做特殊说明,以下都在jQuery框架内执行. 事件冒泡什么是“事件冒泡”呢?假设这里有一杯水,水被用某种神奇的

JS事件（事件冒泡和事件捕获）

事件流:描述的是在页面中接收事件的顺序事件冒泡:由最具体的元素接收,然后逐级向上传播至最不具体的元素的节点(文档) 事件捕获:最不具体的节点先接收事件,而最具体的节点应该是最后接收事件 DOM中:用于处理指定和删除事件处理程序的操作addEventListener()和removeEventListener().他们都接收三个参数:要处理的事件名.作为事件处理程序的函数和布尔值(事件处理的时候)[true:事件捕获时;false:事件冒泡时] DOM中的事件对象: type属性用于获取事件类

彻底弄懂JS的事件冒泡和事件捕获

先上结论:在事件执行流中有两种执行方式.一种是事件冒泡(即事件的执行顺序是从下往上执行的) ; 另一种是捕获(即事件的执行顺序是从上往下执行的); 阻止事件冒泡: return false; 火狐/ie都支持 function(even){ var ev=even||window.even; if(ev&&ev.stopPropagation){ ev.stopPropagation(); }else{ window.event.cancelBubble=true; } } 这

jQuery 学习笔记（5）（事件绑定与解绑、事件冒泡与事件默认行为、事件的自动触发、自定义事件、事件命名空间、事件委托、移入移出事件）

1.事件绑定: .eventName(fn) //编码效率略高,但部分事件jQuery没有实现 .on(eventName, fn) //编码效率略低,所有事件均可以添加注意点:可以同时添加多个相同或不同类型的事件 2.事件解除 .off() 不传参数: $('button').off() //解绑该对象的所有事件一个参数:$("button").off("click") //解绑该对象的“click”类型事件两个参数:$("button"

DOM事件机制(事件捕获和事件冒泡和事件委托)

内容: 1.事件复习 2.事件冒泡与事件捕获 3.事件委托 1.事件复习 (1)事件事件是用来处理响应的一个机制,这个响应可以来自于用户(点击, 鼠标移动, 滚动), 也可以来自于浏览器下面的链接描述了所有事件:https://developer.mozilla.org/en-US/docs/Web/Events (2)事件绑定事件绑定有3种方法,前两钟方法在这里不介绍,主要看第三种: addEventListener方法(使用事件监听绑定事件) addEventListener: 1 e

彻底弄懂JS的事件冒泡和事件捕获（不推荐阅读）

由于搬去敌台了,好久没来博客园,今天无意中翻到有“误认子弟”的评论,这里特意做个说明. 本文中关于事件冒泡和事件捕获的描述和例子都是OK的,错就错在后面用jquery去展示了利用事件冒泡的例子有误,其实这部分就是“事件委托”,而当时的我并不知道,这一点在我很久之前的评论中纠正过. 归根结底,是当时的我对dom事件这个东西没有一个系统的认识.事件模型.事件流.event对象.事件代理/委托.甚至自定义事件,加起来才是dom事件的全貌,都理解了才能彻底弄懂.本想删除了事,但抱着尊重历史的态度(其实是

事件绑定，事件捕获，事件冒泡以及事件委托，兼容IE

● 事件分为三个阶段: 事件捕获 --> 事件目标 --> 事件冒泡 ● 事件捕获:事件发生时(onclick,onmouseover……)首先发生在document上,然后依次传递给body.……最后到达目的节点(即事件目标). ● 事件冒泡:事件到达事件目标之后不会结束,会逐层向上冒泡,直至document对象,跟事件捕获相反 1.onlick -->事件冒泡,重写onlick会覆盖之前属性,没有兼容性问题 ele.onclik = null; //解绑单击事件,将onlic

js事件（事件冒泡与事件捕获）

事件冒泡和事件捕获分别由微软和网景公司提出,这两个概念都是为了解决页面中事件流(事件发生顺序)的问题. <div id='aa' click='po'> <p id='bb' click='on'>点击</p> </div> 上面两个点击事件如果点击的时候,到底谁会被先触发呢,为了解决这个问题微软和网景提出了两种几乎完全相反的概念. 事件冒泡微软提出了名为事件冒泡(event bubbling)的事件流.事件冒泡可以形象地比喻为把一颗石头投入水中,泡泡会一

js进阶 12-2 彻底弄懂JS的事件冒泡和事件捕获

js进阶 12-2 彻底弄懂JS的事件冒泡和事件捕获一.总结一句话总结:他们是描述事件触发时序问题的术语.事件捕获指的是从document到触发事件的那个节点,即自上而下的去触发事件.相反的,事件冒泡是自下而上的去触发事件.绑定事件方法的第三个参数,就是控制事件触发顺序是否为事件捕获.true,事件捕获:false,事件冒泡.默认false,即事件冒泡. 1.事件冒泡是什么? 先child,然后parent.事件的触发顺序自内向外,这就是事件冒泡. 2.事件捕获是什么? 先parent,然后

e.target与e.currentTarget的区别，事件冒泡与事件捕获，事件委托

e.target与e.currentTarget的区别:https://www.jianshu.com/p/1dd668ccc97a 事件冒泡与事件捕获 :https://www.jianshu.com/p/114954ad8fad 事件委托:https://www.jianshu.com/p/ac47521806d2

JS事件冒泡与事件捕获怎么理解?

在js中存在事件冒泡与事件捕获两种概念,这两个概念都是为了解决页面中事件流(事件发生顺序)的问题. 事件冒泡(dubbed bubbling) 事件冒泡我们从字面意思理解就是当用户行为触发我们页面的定义好的事件后,会有一个由内到外的一个冒泡过程,而不是一下子就命中事件绑定的元素事件捕获(event capturing) 事件捕获与冒泡恰恰相反,当鼠标点击或者触发dom事件时,浏览器会从根节点开始由外到内进行事件传播,即点击了子元素,如果父元素通过事件捕获方式注册了对应的事件的话,会先触发父元素

js 事件冒泡和事件捕获

事件流:指的是网页中元素接受事件的顺序,它是一个概念,而不是具体的实际的东西事件冒泡:指的是内层元素的事件,会触发包含着此元素的外层元素的事件,触发的顺序是:由内而外的例如: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <style> div{ pad

js高级：event，事件冒泡，事件捕获

1.事件浏览器客户端上客户触发的行为都称为事件所有的事件都是天生自带的,不需要我们去绑定,只需要我们去触发. 通过 obj.事件名=function(){} 事件名:onmouseover 鼠标悬浮 onmouseout 鼠标移除 onmousedown鼠标按下 onmouseup 鼠标抬起 onmouseenter 鼠标进入 onmouseleare 鼠标离开 onmousemove鼠标移动 onfocus 表单聚焦 onblur 表单失去焦点 onchang

JS高级：事件冒泡和事件捕获；

1.事件:浏览器客户端上客户触发的行为成为时事件:所有的事件都是天生自带的,不需要我们去绑定,只需要我们去触发当用户触发一个事件时,浏览器的所有详细信息都存在一个叫做event的对象上,我们把它叫做事件对象 2.获取鼠标的坐标 event.clientX;event.clientY document.onclick=function(){ event.clientX event.clientY } 3.关于event的兼容性标准:event是undefined 非标准:null 解决兼容:

JS事件冒泡和事件捕获的详解

在学校,听老师讲解事件冒泡和事件捕获机制的时候跟听天书一样,只依稀记得IE使用的是事件冒泡,其他浏览器则是事件捕获.当时的我,把它当成IE浏览器兼容问题,所以没有深究(IE8以下版本的浏览器已基本退出市场).工作至今,虽然多次遇到该类问题,但均未深究,始终一知半解,遇到了全TM靠猜(选A不行就选B呗).今天闲来无事自己做了个demo,算是把这个问题彻底搞明白了. 先上结论:他们是描述事件触发时序问题的术语.事件捕获指的是从document到触发事件的那个节点,即自上而下的去触发事件.相反的,事件

浅谈js的事件冒泡和事件捕获

本文地址:https://www.cnblogs.com/christineqing/p/7607113.html 前言: 这篇文章起源于上次工作上的原因,在事件上出的bug,所以就抽空写出一篇,也便于自己以后查阅,如若有幸被您阅读的话,小妹备感荣幸,文章仅为个人理解,如果内容有误的还望海涵,在您时间还方便的时候,希望能告知小妹!谢谢! 什么是事件? 事件是文档和浏览器窗口中发生的特定的交互瞬间. 事件是javascript应用跳动的心脏,也是把所有东西黏在一起的胶水,当我们与浏览器中w