Javascript中的事件处理

通用的Javascript注册事件的方法

function registerEvent(node , ename , fn) {
				if(node.addEventListener) {
					node.addEventListener(ename , fn , false);	
				} else if(node.attachEvent) {
					node.attachEvent('on' + ename , fn);	
				} else if(node['on' + ename]) {
					node['on' + ename] = fn	;
				}
				
		}

 通用的移除Javascript注册事件的方法

function removeEvent(node , ename , fn) {
			if(node.removeEventListener) {
				node.removeEventListener(ename , fn , false);		
			}	else if(node.detachEvent) {
				node.detachEvent('on' + ename , fn);	
			} else if(node['on' + ename]) {
					node['on' + ename] = null;
			}
		}

  在html中直接写事件代码

  οnclick="alert(event.screenX)"   所有的浏览器都支持这个event

  οnclick="alert(window.event.screenX)"  Firefox不支持这个window.event,而其他浏览器支持

 

使用attachEvent 和 addEventListener注册的函数句柄,会默认为函数传递一个event对象。

 

所有的DOM浏览器(不是IE)在注册事件函数的时候,都会向函数传递一个event对象,而IE浏览器只有通过

attachEvent注册的事件才会传递event对象,但是可以通过window.event来引用event对象,所以最好的方法

function bindfun(e) {

     e = e || window.event;

}

首先检测是否传递了event函数,如果没有传递,则使用window.event对象。

 

阻止事件向上冒泡

e.stopPropagation?e.stopPropagation():e.cancelBubble = true;

 

e.stopPropagation();     DOM类型浏览器支持

 

e.cancelBubble = true;   IE浏览器支持

 

e.bubbles   DOM浏览器,返回事件是否向上冒泡 只读属性

 

e.cancelable  DOM浏览器,返回事件是否可以通过使用e.preventDefault()阻止浏览器的默认行为 只读属性

 

e.keyCode    DOM + IE  keydown,keypress,keyup时候都能返回按键的ascii码

 

e.currentTarget   DOM浏览器 返回当前发生事件的元素(如果事件传播则为当前传播到的对象)

 

                            IE浏览器中没有这个属性,要想在IE浏览器中冒泡阶段获得当前发生事件的对象,需要在

                           

                            绑定的事件函数中传入当前对象this

 

e.target               DOM浏览器  返回事件源的DOM元素,始终指向的是出发事件的根源节点,而不是冒泡后指向的节点

                            IE浏览器中使用srcElement

                           var target =  e.target ? e.target : e.srcElement;

 

e.eventPrase       当前发生事件所处的阶段 DOM浏览器支持

                           2 : 就是最开始出发的事件源

                           3 : 事件冒泡传播到了别的元素上

 

e.type                 当前事件类型  click  keyup等  所有的浏览器均支持

 

e.altKey   e.ctrlKey   e.shiftKey

                           发生事件时,键盘按键是否处于按下的状态,只读,返回boolean值

 

e.button               触发事件 例如 mousedown事件

                            值:

                                DOM

                                          0 : 左键

                                          1 : 中键

                                          2 : 右键

                                IE

                                          0 : 左键

                                          4 : 中键

                                          2 : 右键

 

e.clientX e.clientY      返回的是 光标 距离浏览器窗口左上角顶点的坐标

                                 clientX表示的是横坐标

                                 clientY表示的是纵坐标

e.screenX e.screenY  返回的是  光标 距离屏幕左上角顶点的坐标

                                  screenX表示的是横坐标

                                  screenY表示的是纵坐标

e.pageX   e.pageY      返回的是 光标距离当前文档的左上角顶点的坐标            IE浏览器不支持此属性

                                  pageX  表示的是横坐标

                                  pageY  表示的是纵坐标

e.offsetX e.offsetY      返回的是 光标距离当前发生事件的元素的距离                Firefox不支持此属性

                                  offsetX 表示的是横坐标

                                  offsetY表示的是纵坐标

e.returnValue  = false;            阻止浏览器的默认行为       Firefox不支持此属性

                                  e.preventDefault?e.preventDefault():e.returnValue = false;

 

 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值