- 浏览: 457249 次
- 性别:
- 来自: 南京
文章分类
最新评论
-
a1439226817:
能不能发下源码1439226817@qq.com
ExtJsCRUD组件实现 -
w923690968:
[list][*]引用[u][/u][/list]
[JS]Drag And Drop -
zhumingyuan:
您好!用的的是3.2.3版本,按照您的方法配置了一下,但是还是 ...
spring vmc3.1.1 下,通过AnnotationMethodHandlerAdapter配置webBindingInitializer失效解决方案 -
sumo084:
我把xDarkness-MultClrBubble-1.0.j ...
JAVA实现类泡泡屏保效果 -
sumo084:
求源码,楼主好人,630483738@qq.com,谢谢
JAVA实现类泡泡屏保效果
今天看到这样一段代码,如下:
仔细一看,其实是实现了dom的多事件注册,稍稍重构了一下,将事件注册的任务封装进EventManager中,这样看着舒服多了,而且以后可以重用:
Page.clickFunctions = []; Page.click = function(event){ for(var i=0;i<Page.clickFunctions.length;i++){ Page.clickFunctions[i](event); } if(window!=window.parent&&window.parent.Page){ window.parent.Page.click(); } } Page.onClick = function(f){ Page.clickFunctions.push(f); } Page._Sort = function(a1,a2){ var i1 = a1[1]; var i2 = a2[1]; if(typeof(i1)=="number"){ if(typeof(i2)=="number"){ if(i1>i2){ return 1; }else if(i1==i2){ return 0; }else{ return -1; } } return -1; }else{ if(typeof(i2)=="number"){ return 1; }else{ return 0; } } } Page.loadFunctions = []; Page.load = function(){ Page.loadFunctions.sort(Page._Sort); for(var i=0;i<Page.loadFunctions.length;i++){ try{ Page.loadFunctions[i][0](); }catch(ex){ } } } Page.onLoad = function(f,index){ index = index || 1; Page.loadFunctions.push([f,index]); } Page.readyFunctions = []; Page.ready=function(){ if(window._OnReady){ try{window._OnReady();}catch(ex){} } Page.readyFunctions.sort(Page._Sort); for(var i=0;i<Page.readyFunctions.length;i++){ try{Page.readyFunctions[i][0]();}catch(ex){} } }; Page.onReady= function(f,index){ Page.readyFunctions.push([f,index]); }; Page.mouseDownFunctions = []; Page.mousedown = function(event){ for(var i=0;i<Page.mouseDownFunctions.length;i++){ Page.mouseDownFunctions[i](event); } } Page.onMouseDown = function(f){ Page.mouseDownFunctions.push(f); } Page.mouseUpFunctions = []; Page.mouseup = function(event){ for(var i=0;i<Page.mouseUpFunctions.length;i++){ Page.mouseUpFunctions[i](event); } } Page.onMouseUp = function(f){ Page.mouseUpFunctions.push(f); } Page.mouseMoveFunctions = []; Page.mousemove = function(event){ for(var i=0;i<Page.mouseMoveFunctions.length;i++){ Page.mouseMoveFunctions[i](event); } } Page.onMouseMove = function(f){ Page.mouseMoveFunctions.push(f); } Page.keyDownFunctions = []; Page.keydown = function(event){ for(var i=0;i<Page.keyDownFunctions.length;i++){ Page.keyDownFunctions[i](event); } } Page.onKeyDown = function(f){ Page.keyDownFunctions.push(f); } /* 监听document对象上的click、mousedown、load、mouseup、mousemove事件 */ if (document.attachEvent) { document.attachEvent("onclick", Page.click); document.attachEvent("onmousedown", Page.mousedown); window.attachEvent("onload", Page.load); document.attachEvent("onmouseup", Page.mouseup); document.attachEvent("onmousemove", Page.mousemove); } else { document.addEventListener("click", Page.click, false); document.addEventListener("mousedown", Page.mousedown, false); window.addEventListener("load", Page.load, false); document.addEventListener("mouseup", Page.mouseup, false); document.addEventListener("mousemove", Page.mousemove, false); }
仔细一看,其实是实现了dom的多事件注册,稍稍重构了一下,将事件注册的任务封装进EventManager中,这样看着舒服多了,而且以后可以重用:
/* 监听document/window对象上的click、mousedown、load、mouseup、mousemove事件 */ Page.onClick = function(fun) { Sky.EventManager.addEvent(document, "click", fun); } Page.onLoad = function(fun, index) { Sky.EventManager.addEvent(window, "load", fun, index); } Page.onMouseDown = function(fun) { Sky.EventManager.addEvent(document, "mousedown", fun); } Page.onMouseUp = function(fun) { Sky.EventManager.addEvent(document, "mouseup", fun); } Page.onMouseMove = function(fun) { Sky.EventManager.addEvent(document, "mousemove", fun); } Page.onKeyDown = function(fun) { Sky.EventManager.addEvent(document, "keydown", fun); }
发表评论
-
google浏览器书签账号登陆不上解决方案
2011-10-10 09:22 760问题: 最近google浏览器书签同步账号登陆不上 ... -
excanvas饼图实现
2010-10-21 15:04 2759代码比较简单,需要注意的一点就是: 如果想让饼图的边框显示出来 ... -
DOM中cloneNode的使用之旅
2010-10-21 14:52 2458struts2中可以自动封装表单提交过来的参数 List< ... -
Tab键控制页面中元素获取焦点顺序
2010-08-19 17:35 4047修改默认Tab键按键触发,界面元素获取焦点的顺序 此方法 ... -
JS-自动提示组件
2010-08-19 17:23 1727注:源自Ajax实战 实现自动提示功能: <!DOCT ... -
js实现在图片上画矩形框
2010-08-18 16:10 10764JS组件: @author Darkness @versio ... -
JS控制输入字符长度
2009-11-09 10:50 5507<script language="Jav ... -
internet explorer 无法打开 Internet站点 已中止操作
2009-09-26 18:20 2115JavaScript使IE的经典异常 代码 http://ww ... -
fusioncharts相关问题
2009-09-26 15:59 1701中文问题 使用UTF-8 or GBK,X 轴正常, ... -
js日期时间函数
2009-09-20 17:28 1142Date.prototype.isLeapYear 判断闰 ... -
IE6 png 透明 (三种解决方法)
2009-09-14 14:49 1980FF和IE7已经直接支持透明的png图了,下面这个主要是解决I ... -
类似MSN的消息提示
2009-08-18 11:00 926<html> <head> ... -
IE6的“错误:53 存储空间不足,无法完成此操作”解决方法
2009-08-07 21:10 7944一法: 打开注册表, ... -
表格边框的隐藏
2009-08-07 09:19 2553代码如下: <html> <he ... -
JS操作VML
2009-08-03 14:52 2738可以用鼠标拖动这条线,效果如图: 说明:还有一些bug, ... -
javascript技巧大全 (3)
2009-03-06 12:36 1083... -
javascript技巧大全(2)
2009-03-06 12:33 1285进入页面<meta http-equiv="P ... -
javascript技巧大全(1)
2009-03-06 12:32 1110事件源对象 event.srcElement.tagName ... -
javascript性能优化
2009-02-27 10:56 4312很久就想总结一下关于javascript性能优化方面的一些东西 ... -
JavaScript DOM笔记:修改DOM
2009-02-27 10:51 2210常用函数: creat ...
相关推荐
HTML DOM 事件允许Javascript在HTML文档元素中注册不同事件处理程序。 事件通常与函数结合使用,函数不会在事件发生前被执行! (如用户点击按钮)。 提示: 在 W3C 2 级 DOM 事件中规范了事件模型。
4.3 控制事件流和注册事件侦听器 4.3.1 事件流 4.3.2 注册事件 4.3.3 在事件侦听器中访问事件对象 4.3.4 跨浏览器的事件属性和方法 4.4 小结 第5章 动态修改样式和层叠样式表 ...
因为对于支持DOM的浏览器来说,添加事件是用addEventListener()方法来给对象添加事件! 而对于MSIE来说则是用attachEvent()来给对象添加事件!这就使得我们必须用一个容器来装载这两个不同浏览器上对事件的处理方式...
事件捕获(event capturing):通俗的理解就是,当鼠标点击或者触发dom事件时,浏览器会从根节点开始由外到内进行事件传播,即点击了子元素,如果父元素通过事件捕获方式注册了对应的事件的话,会先触发父元素...
4.3 控制事件流和注册事件侦听器 4.3.1 事件流 4.3.2 注册事件 4.3.3 在事件侦听器中访问事件对象 4.3.4 跨浏览器的事件属性和方法 4.4 小结 第5章 动态修改样式和层叠样式表 ...
4.3 控制事件流和注册事件侦听器 4.3.1 事件流 4.3.2 注册事件 4.3.3 在事件侦听器中访问事件对象 4.3.4 跨浏览器的事件属性和方法 4.4 小结 第5章 动态修改样式和层叠样式表 ...
dom事件将 W3C DOM 事件实现为 JavaScript 组件。安装使用安装: $ component install graouts/dom-events用法您可以创建一个 EventTarget 实例并使用它来注册事件侦听器和调度事件: var DOM = require ( "dom-...
该接口提供了 ‘addEventListener’ 和 ‘removeEventListener’ 方法,... 事件注册 根据 DOM 2 Events 中描述,节点使用 ‘addEventListener’ 和 ‘removeEventListener’ 方法绑定和解绑事件监听器,但 IE6 IE7 IE
自定义事件注册和触发像 dom 事件 节点示例 var event = require ( 'modulex-event-custom' ) ; var xutil = require ( 'modulex-util' ) ; var target = xutil . mix ( { } , event . Target ) ; target . on ( '...
} 结果出现了问题,所有的dom都被注册了 i=n 的时候的事件,查了一些资料,说是在循环过程过this被改变,注册过的事件也被随之改变,找到了一种解决方法; 代码如下: for (var i=0; i<n; i++) { (function (i){...
事件域 事件注册和跨浏览器触发 例子 modulex . use ( [ 'event-dom' ] , function ( Event ) { Event . on ( document . getElementById ( 't' ) , 'click' , function ( ) { } ) ; } ) ;
什么是事件委托 事件委托:利用事件冒泡的特性,将本应该注册在子元素上的处理事件注册在父元素上,这样点击子元素时发现其本身没有相应事件就到父元素上寻找作出相应。这样做的优势有: 减少DOM操作,提高性能...
使用功能onLoad.newHandler()您可以注册在DOM完全加载后发生的事件。 使用以下格式: onLoad.newHandler(function(){ console.log("Do Stuff Here"); }); 或者: var testFunction = function(){ console.log("Do ...
FT的dom委托库是一个组件,用于绑定与给定选择器匹配的所有目标元素上的事件,而不管注册时DOM中是否存在任何东西。 这使开发人员可以实现。 用法 查看以开始使用ftdomdelegate 。 JavaScript 要导入ftdomdelegate...
html DOM元素有很多on开头的监听事件,如onload、onclick等,见DOM事件列表。但是同一种事件,后面注册的会覆盖前面的: [removed] = function(){ alert(1); } [removed] = function(){ alert(2)...
刺激存在刺激控制器,从dom中删除元素,并在添加元素时收到事件通知。安装$ yarn add stimulus-existence用法向控制器注册控制器: // application.jsimport { Application } from "stimulus" ;import { ...
JQuery这种Write Less Do More的框架,用多了难免会对原生js眼高手低。 ... 直接在dom对象上注册事件名称,就是DOM0写法,比如: 代码如下: document.getElementById(“test”).onclick = functi
W3C和微软都着力于发展自己的事件注册模型来取代Netscape的传统模型。虽然对于微软的模型我不是很感冒,但是w3c的还是不错的,除了这个鼠标定位 的问题。不过现在只有小部分浏览器支持。 W3C W3C的DOM层面事件规范...
JavaScript对象与DOM对象进行绑定会遇到一个问题:如果被绑定的对象的方法中包含this关键字,当事件被触发时this指向的却是DOM对象,而不是之前的JS对象。