jQuery学习-事件之绑定事件(三)
在上一篇《jQuery学习-事件之绑定事件(二)》我们了解了jQuery的dispatch方法,今天我们来学习下handlers
方法:
handlers: function( event, handlers ) { var sel, handleObj, matches, i, handlerQueue = [], delegateCount = handlers.delegateCount, cur = event.target;//绑定委托事件的元素 // Find delegate handlers // Black-hole SVG <use> instance trees (#13180) // Avoid non-left-click bubbling in Firefox (#3861) //委托事件过滤,符合条件的事件才会被加入事件队列中 if ( delegateCount && cur.nodeType && (!event.button || event.type !== "click") ) { /* jshint eqeqeq: false */ for ( ; cur != this; cur = cur.parentNode || this ) { /* jshint eqeqeq: true */ // Don't check non-elements (#13208) // Don't process clicks on disabled elements (#6911, #8165, #11382, #11764) /* nodeTyp: 元素element 1 属性attr 2 文本text 3 注释comments 8 文档document 9 * */ if ( cur.nodeType === 1 && (cur.disabled !== true || event.type !== "click") ) { matches = []; for ( i = 0; i < delegateCount; i++ ) { handleObj = handlers[ i ]; // Don't conflict with Object.prototype properties (#13203) sel = handleObj.selector + " "; if ( matches[ sel ] === undefined ) { matches[ sel ] = handleObj.needsContext ? jQuery( sel, this ).index( cur ) >= 0 : jQuery.find( sel, this, null, [ cur ] ).length;//判断【当前元素】是否是【绑定委托事件元素】的子元素 } if ( matches[ sel ] ) { matches.push( handleObj ); } } if ( matches.length ) { handlerQueue.push({ elem: cur, handlers: matches });//将符合条件的事件加入事件队列中 } } } } //将非委托事件加入事件队列 if ( delegateCount < handlers.length ) { handlerQueue.push({ elem: this, handlers: handlers.slice( delegateCount ) }); } return handlerQueue;
}
OK,到这里了,哈哈!
jQuery学习-事件之绑定事件(三)的更多相关文章
- jQuery学习-事件之绑定事件(二)
在上一篇<jQuery学习-事件之绑定事件(一)>我们了解了jQuery的add方法,今天我们来学习下dispatch方法: dispatch: function( event ) { ...
- jQuery学习-事件之绑定事件(一)
我们都知道jQuery的事件其思想来源于Dean Edwards的addEvent,通过源码我们知道jQuery在为元素绑定事件时,每种类型的事件(click,blur)时只绑定了一次对应类型的事件处 ...
- jQuery如何给body绑定事件?
jQuery如何给body绑定事件? 代码如下: $(document).bind("resize", function () { alert("php-note.com ...
- JQuery在循环中绑定事件的问题详解
JQuery在循环中绑定事件的问题详解 有个页面上需要N个DOM,每个DOM里面的元素ID都要以数字结尾,比如说 ? 1 2 3 <input type="text" nam ...
- jQuery学习小结1-CSS操作+事件
一.DOM对象和jQuery 对象互换 1.jQuery对象 就是通过jQuery包装DOM对象后产生的对象.jQuery对象是jQuery独有的,其可以使用jQuery里的方法.比如: $(&quo ...
- [jquery]高级篇--js绑定事件
参考: http://www.cnblogs.com/leejersey/p/3545372.html jQuery on()方法是官方推荐的绑定事件的一个方法.$(selector).on(eve ...
- jQuery相关方法7----各种事件和绑定事件
一.jQuery事件 1.鼠标事件 click与dbclick事件 click事件其实是由mousedown与mouseup 2个动作构成,所以点击的动作只有在松手后才触发 $ele.click(): ...
- jquery html 动态添加元素绑定事件
由于实际的需要,有时需要往网页中动态的插入HTML内容,并在插入的节点中绑定事件处理函数.我们知道,用Javascript向HTML文档中 插入内容,有两种方法, 一种是在写HTML代码写入JS,然后 ...
- jquery事件与绑定事件
1.首先,我们来看一下经常使用的添加事件的方式: <input type="button" id="btn" value="click me!& ...
随机推荐
- asp.net后台向前端输出js脚本的三种方法
//这个方法最快,因为它会输出到html标签之前 Response.Write("<script type='text/javascript'>alert('这个最快')< ...
- python爬图
闲的无事,看着知乎里种种python优点,按捺不住,装起python3.4. 网上找了点爬行图片的代码,修改至兼容3.4,成功爬行指定url所有jpg图片,代码段如下: import os impor ...
- 括号配对问题--nyoj-2(栈)
括号配对问题 时间限制:3000 ms | 内存限制:65535 KB 难度:3 描述现在,有一行括号序列,请你检查这行括号是否配对. 输入 第一行输入一个数N(0<N<=10 ...
- Cube(hd1220)
Cube 点我 Problem Description Cowl is good at solving math problems. One day a friend asked him such a ...
- Objective-C实现计算你写了多少行代码
#import <Foundation/Foundation.h> NSInteger codeLineCount(NSString *path) { //1.获取文件管理者,这是一个单例 ...
- docker 使用Data Volume 共享文件
Adding a data volume You can add a data volume to a container using the -v flag with the docker run ...
- mysql tee 命令
tee 命令说明: 用过mysql的应该都会知道mysql有一个叫show 的命令,这个命令应该是SQL标准之外的一个扩展:和这个类似mysql还扩展了一个叫tee的命令. tee的功能是把你的所有输 ...
- TComponent与String的转换(得到控件的DFM格式的描述)
现看下面这两个方法,把一个TComponent做成String,再就是把String转成TComponent function ComponentToStringProc(Component: TCo ...
- 【FSFA 读书笔记】Ch4 Volume Analysis & Cr 5 PC-based Partitions
Volume Analysis 1. “卷”可以理解为从逻辑上对物理存储设备的重新编制,便于操作系统管理. (A volume is a collection of addressable secto ...
- nyoj 325 zb的生日(dfs)
描述今天是阴历七月初五,acm队员zb的生日.zb正在和C小加.never在武汉集训.他想给这两位兄弟买点什么庆祝生日,经过调查,zb发现C小加和never都很喜欢吃西瓜,而且一吃就是一堆的那种,zb ...