摘要：Ext的事件管理非常强大。主要定义在Ext.EventManager对象(单例模式)中。该对象有以下方法addListenerremoveListenerremoveAllgetListenerspurgeElement_unloadonDocumentReadyonunstoppedMouseDownEventon / un 是 addListener / removeListener的快捷方式 。stoppedMouseDownEvent 是 Ext.util.Event 类的实例对象，这个类定义在Observable.js中。stoppedMouseDownEvent 在Ext.Even
阅读全文
摘要：Ext库也对浏览器原生的事件对象做了包装，以保证兼容所有浏览器。这里列举了浏览器原生事件对象各浏览器中兼容性，这里列出了各种情况下事件对象的获取。在Ext事件管理类 Ext.EventManager 中会悄悄的将浏览器原始事件对象进行转换e = Ext.EventObject.setEvent(e);Ext.EventObject 即为包装后的事件对象(暂称为Ext事件对象)。先从全局上看看该对象的实现，其中...省略了部分代码。Ext.EventObject = function(){ var E = Ext.lib.Event, ...; Ext.EventObjectImp...
阅读全文
摘要：Ext.util.TaskRunner 用来管理多任务定时管理。每一个任务是一个JS对象，具有以下属性run, interval, args, scope, duration, repeat。示例如下：var task = { run : function(){...}, interval : 1000, args : [], scope : obj, duration : 5000, repeat : 3}run和interval是必选，其它为可选。鸟瞰类如下：Ext.util.TaskRunner = function(interval){ interval = interval |...
阅读全文
摘要：Ext.util.DelayedTask类从名字上就可以看出它是延迟任务的执行。即指定时间之后执行任务。整个类如下：Ext.util.DelayedTask = function(fn, scope, args){ var me = this, id, call = function(){ clearInterval(id); id = null; fn.apply(scope, args || []); }; me.delay = function(delay, newFn, newScope, newA...
阅读全文
摘要：上篇看了ext-base-event.js(Ext.lib.Event)，这篇看ext-base-dom.js(Ext.lib.Dom)。后续EventManager.js(Ext.EventManager)其中会用到该篇的Ext.lib.Dom。整体浏览ext-base-dom.js可以看到还是一个匿名函数执行，与上一篇不同的是这次并非返回包装好的对象pub，而是直接将对象赋值给Ext.lib.Dom。(function(){ var doc = document, ...; Ext.lib.Dom = { ... };})();一些变量声明，var doc =...
阅读全文
摘要：这篇开始读ext-base-event.js。该文件定义了Ext.lib.Event对象，Ext.lib这个命名空间在Ext core的Ext.js中命名的。Ext.ns("Ext.util", "Ext.lib", "Ext.data");Ext.lib上的属性如下：Ext.lib.AjaxExt.lib.AnimExt.lib.AnimMgrExt.lib.BezierExt.lib.DomExt.lib.EasingExt.lib.EventExt.lib.AnimBaseExt.lib.ColorAnimExt.lib.Mot
阅读全文
摘要：续上篇，Ext.ns = Ext.namespace; 有了一个简写的namespace。整个匿名函数执行完了。接下来Ext.ns("Ext.util", "Ext.lib", "Ext.data"); Ext.elCache = {}; 分别为Ext添加了util，lib，data，elCache属性，默认都是空的对象。Ext.apply(Function.prototype, { createInterceptor : function(){ // ... }, createCallback : function(){ // ..
阅读全文
摘要：如下代码<p id="tit"></p><script> var p = document.getElementById('tit'); var div = document.createElement('div'); p.appendChild(div); try { div.innerHTML = "76" } catch(e) { //IE<9 ERROR alert(e) }</script>执行顺序如下1，获取页面上段落元素P2，创建一个块级元素div3，将d
阅读全文
摘要：如下代码<p id="tit"></p><script> try { document.getElementById('tit').innerHTML = "<div>trtr</div>"; } catch(e) { //IE<9 ERROR alert(e) }</script>获取页面中id为tit的元素，为其innerHTML赋值。IE6/7/8中抛异常，其它浏览器正常。但规范指出，段落P是不能包含P自身及其它块级元素的。IE6/7/8的处理洽洽是对的，
阅读全文
摘要：上篇看到Ext.extend，接着往下看。Ext.namespace，用来管理Ext库命名空间的方法namespace : function(){ var o, d; Ext.each(arguments, function(v) { d = v.split("."); o = window[d[0]] = window[d[0]] || {}; Ext.each(d.slice(1), function(v2){ o = o[v2] = o[v2] || {}; }); }); return...
阅读全文
摘要：第一句window.undefined = window.undefined; 兼容IE6以下的浏览器，有人解释过了。定义Ext全局变量Ext = { version : '3.1.0'};注意这里没有使用var，不使用var声明变量被认为是不好的编程习惯，尤其是函数内声明变量不写var更被称为是无穷无尽的Bug根源。这里则不会，因为变量Ext是该库唯一的全局变量(命名空间)。其它Ext源码中的变量声明都加上了var。给Ext添加静态apply方法，该方法是核心方法之一，会用其扩展Ext。Ext.apply = function(o, c, defaults){ // no .
阅读全文
摘要：距离上一次源码阅读近一年了，这时已经更新到了1.7.2。HTML元素的位置相关的css属性有top、left、bottom、right。要灵活使用这些属性，需要了解css的定位模型position：正常文档流，相对定位，绝对定位。了解了这些css知识才更清楚jQuery的position及offse...
阅读全文
摘要：前端开发过程中，经常需要这样的场景。用JS实现将光标定位于输入框最右侧。场景一：编辑图片的描述文字场景二：Script.aculo.us的Ajax.InPlaceEditor类。双击可编辑，编辑后离开可自动更新该区域以上场景都需要JS实现将光标定位于输入框最右侧，却不是通过鼠标点入输入框内。我们知道...
阅读全文
摘要：后端同事想采用REST风格，hailiang在看jQuery文档时发现的$.ajax不是所有浏览器中都支持put/delete。但没有指出具体是那些浏览器。我新建了一个Java WEB项目测试所有浏览器，但都支持put和delete。测试浏览器版本如下Firefox 11Chrome 18Safari 5Opera11.62IE9 （含ie7,8模式）IE6 （IETester及虚拟机中的ie6）记录之！相关：http://www.douban.com/group/topic/5020441/http://annevankesteren.nl/2007/10/http-method-suppo
阅读全文
摘要：这是liaoxiang在sohu博首发现的（junhai的机器也重现了），精简后重现代码如下<!DOCTYPE html><html> <head> <meta charset="utf-8"/> </head> <body> <div style="height:4100px;background: gray;filter:alpha(opacity=30)"> <p>TEST</p> <p>TEST</p> <p&
阅读全文
摘要：这是sina同事xiaoniu发现的，如下<!DOCTYPE html><html> <head> <meta charset="utf-8"/> </head> <body> <div id="02E503E2A1C011CFC85B7B701A0677EC0900000000000001"></div> <script> var str = '02E503E2A1C011CFC85B7B701A0677EC090000000000000
阅读全文
摘要：placeholder属性是HTML5中提出的，目前Firefox/Safari/Chrome/Opera都已经实现了。IE9仍然没实现。但Safari/Chrome中有个问题，点击文本框内文字不消失。如下<!DOCTYPE html><html> <head> <title>Safari/Chrome中placeholder属性实现不完整</title> <meta charset="utf-8"> </head> <body> <p> <input type
阅读全文
