【学习点滴-js】js 中事件对象封装。

由于浏览器的差异。事件中的一些处理不得不出现大量这样类似的代码  var event = event?event:window.event;

这当然不是我们想要的,于是需要把常见的事件处理封装起来,便于我们方便地使用。

javascript 高级程序设计中封装代码如下:


	var EventUtil = {
		/* 添加时间处理程序 */
		addHandler : function(element,type,handler){
			if(element.addEventListener){
				element.addEventListener(type,handler,false);
			}else if(element.attachEvent){
				element.attachEvent("on"+type,handler);
			}else{
				element["on"+type] = handler;
			}
		},
		/* 获取event对象的引用 */
		getEvent: function(event){
			return event? event : window.event;
		},
		/* 获取事件的目标 */
		getTarget:function(event){
			return event.target || event.srcElement;
		},
		/* 取消事件的默认函数 */
		preventDefault:function(event){
			if(event.preventDefault){
				event.preventDefault();
			}else{
				event.returnValue = false;
			}
		},
		/* 移除时间处理程序 */			
		removeHandler : function(){
			if(element.removeEventListener){
				element.removeEventListener(type,handler,false);
			}else if(element.detachEvent){
				element.detachEvent("on"+type,handler);
			}else{
				element["on"+type] = null;
			}
		},
		/* 阻止事件流继续传播 */
		stopPropagation : function(event){
			if(event.stopPropagation){
				event.stopPropagation();
			}else{
				event.cancelBubble = true;
			}
		},
		/* 获取相关元素 */
		getRelatedTarget : function(event){
			if(event.relatedTarget){
				return event.relatedTarget;
			}else if(event.toElement){
				return event.toElement;
			}else if(event.fromElement){
				return event.fromElement;
			}else{
				return null;
			}
		},
		/*获取按键编码*/
		getCharCode : function(event){
			return (typeof event.charCode == "number")?event.charCode:event.keyCode;
		},	
		//获取剪切板数据
		getClipboardText:function(event){
			var clipboardData = window.clipboardData || event.clipboardData;
			return clipboardData.getData("text");
		}	
	};




  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值