摘要：
对原生js不熟悉看jQuery会困难很多。后续需要更多的关注下原生jsjQuery封装之后的事件触发，其中一个分支（处理普通事件）是通过：elem.addEventListener( type, eventHandle, false );来完成的。通过这一句，为元素绑定一个事件监听器，并绑定eventHandler事件处理程序。该事件监听程序内部调用dispatch方法处理并执行用户真正绑定到该元素上的所有事件处理程序。相当于在所有的事件处理程序外围又包括了一个方法。接下来看下dispatch内部做了哪些事情：// 这里的event参数其实是一个普通的原生event对象，是从elem.addE 阅读全文
posted @ 2013-12-12 23:44
charling
阅读(713)
评论(0)
推荐(0)
摘要：
看了几天，决定整理一下jQuery事件处理的整体设计思路1、通过add方法给选中的元素注册事件处理程序（通过缓存系统将事件储存到cache，而不是绑定到元素上） a、在存储之前，会为事件处理程序增加guid属性（jQuery里的唯一标识）， b、先从cache中取出已经储存的以当前元素为桥梁的对象的events属性，如果没有就新建一个。 c、再从cache中取出已经储存的以当前元素为桥梁的对象的handler属性（是一个方法），如果没有就新建一个。 备注：cache中存储的对象有两个属性：events、handler。2、通过dispatch方法分派事件处理函数（从缓存中读取出所有的事... 阅读全文
posted @ 2013-12-11 23:37
charling
阅读(264)
评论(0)
推荐(0)
摘要：
继续了解jQuery对浏览器兼容的处理1、keyHooks对键盘按键的封装keyHooks: { // 一些键盘相关的属性 props: "char charCode key keyCode".split(" "), // 新的event对象和原生的event对象作为参数传入filter filter: function( event, original ) { // 如果event中没有which属性，新声明一个which属性并赋值 if ( event.which == null ) { // 原生event中如果有charCode，就将它的ch.. 阅读全文
posted @ 2013-12-10 21:49
charling
阅读(292)
评论(0)
推荐(0)
摘要：
通过之前对event.add方法的分析，发现jQuery在事件注册期间，将用户绑定的事件通过jQuery的缓存系统储存在了$.cache中，jQuery对事件主要做的事情：1、事件管理 a、事件注册时，通过add方法，将事件储存在$.cahce[ 唯一ID ][ $.expand ][ 'events' ]上，events内部是“事件类型”：“事件处理函数数组”形式的对象 b、事件触发时，通过trigger和handler从cache中查找并执行 c、事件销毁时，通过removie方法从cache中查找并删除2、浏览器兼容的处理 a、差异： firefox、chrome、opr 阅读全文
posted @ 2013-12-09 22:01
charling
阅读(423)
评论(0)
推荐(0)
摘要：
1、jQuery事件绑定的用法：$( "elem" ).on( events, [selector], [data], handler );events:事件名称，可以是自定义事件名称selector:选择器data:事件触发时传递给事件处理函数handler:事件处理函数2、on方法源码分析on: function( types, selector, data, fn, /*INTERNAL*/ one ) { var origFn, type; // 如果types是对象，则说明是传入了多个事件 if ( typeof types === "object&qu 阅读全文
posted @ 2013-12-08 22:18
charling
阅读(3021)
评论(0)
推荐(0)
摘要：
// data html字符串 // context 如果指定了context，则碎片将在此范围内被创建，默认是document // keepScripts 如果是true，则将有scripts加入html字符串 parseHTML: function( data, context, keepScripts ) { //如果data不存在或者data不是字符串则直接返回null if ( !data || typeof data !== "string" ) { return null; } // 如果context是Boolean则说明用户没有传入context，而是传 阅读全文
posted @ 2013-12-06 09:20
charling
阅读(700)
评论(0)
推荐(0)
摘要：
1、首先定义构造函数function Cl(){ var that = this; that.a = "a"; that.b = "b";}2、将Cl构造函数的prototype赋值给一个变量var pro = Cl.prototype;3、在构造函数的prototype上绑定方法pro.init = function(){ this.getName();};pro.getName = function(){ return "cl";};4、抛出构造函数5、使用时var o = new Cl();o.init();备注：想学习jQue 阅读全文
posted @ 2013-12-05 23:39
charling
阅读(271)
评论(0)
推荐(0)
摘要：
jQuery.when()方法是jQuery内部使用回调机制的范例。// 参数为多个方法，这些方法全部执行完成之后执行回调 when: function( subordinate /* , ..., subordinateN */ ) { var i = 0, // 将传入的参数切成数组 resolveValues = core_slice.call( arguments ), length = resolveValues.length, // 未执行完成的方法 、 remaining = length !== 1 || ( subordinate &&... 阅读全文
posted @ 2013-12-04 23:46
charling
阅读(280)
评论(0)
推荐(0)
摘要：
jQuery.extend({ /* * deferred对象的一大好处，就是它允许你自由添加多个回调函数。 *$.ajax("test.html") .done(function(){ alert("哈哈，成功了！");} ) .fail(function(){ alert("出错啦！"); } ) .done(function(){ alert("第二个回调函数！");} ); *deferred对象的另一大好处，就是它允许你为多个事件指定一个回调函数，这是传统写法做不到的。 当两个操作都成功了才执行成功的回调 阅读全文
posted @ 2013-12-04 00:13
charling
阅读(1651)
评论(0)
推荐(0)
摘要：
// 对option的一个缓存，避免每次都需要createOptions，option是创建Callback对象时的传入的参数// 每个option被存入optionsCache中类似于{memory:true, once:true,...}var optionsCache = {};// 将字符串表达转成对象表达，并存在缓存中，一个内部使用的方法。function createOptions( options ) { var object = optionsCache[ options ] = {}; jQuery.each( options.match( core_rnotwhit... 阅读全文
posted @ 2013-12-02 23:32
charling
阅读(521)
评论(0)
推荐(0)
浙公网安备 33010602011771号