javascript事件

来源:互联网 发布:java待遇 编辑:程序博客网 时间:2024/04/30 14:10

js事件存在浏览器兼容问题

firefox(w3c标准):addEventListener(),removeEventListener()

ie :attachEvent(),detachEvent()

对js进行封装

/* * 创建对象,往对象属性上面添加方法。调用监听器就调用对象的属性 *///创建对象var eventUtil = new Object();//简单封装模型eventUtil.addEvent = function(dom,type,fn){if(dom.addEventListener){//如果有这个属性dom.addEventListenr(type,fn,false);}else{dom.attachEvent("on"+type,fn);}};//优化封装模型eventUtil.addEvent = function(dom,type,fn){//var _fn = function(){//var target = event.target || event.srcElement;//fn(event,target);//};if(dom.addEventListener){//dom.addEventListener(type,fn,false);修改dom.addEventListener(type,function(){var target = event.target || event.srcElement;fn(event,target);},false);}else{dom.attachEvent("on"+type,function(){var target = event.target || event.srcElement;fn(event,target);});}};//简单封装模型eventUtil.removeEvent = function(dom,type,fn){if(dom.removeEventListener){dom.removeEventListener(type,fn,false);}else{dom.detachEvent("on"+type,fn);}};//优化封装模型eventUtil.removeEvent = function(dom,type,fn){var _fn = function(event){var target = event.target || event.srcElement;fn(event,target);};if(dom.removeEventListener){dom.removeEventListener(type,_fn,false);}else{dom.detachEvent("on"+type,_fn);}};
事件的属性:

//事件属性,触发事件都会传递一个参数div.onclick = function() {alert(arguments.length);//从中可以看出触发事件都会传递过来一个参数};div.onclick = function(event){event = event || window.event;//兼容性代码var target = event.target || event.srcElement;//事件源var type = event.type;var x = event.clientX;//获得客户端坐标var y = event.clientY;var screenX = event.screenX;//获得屏幕坐标var screentY = event.screenY;var code = event.keyCode;//获得按下键的码};

阻止默认拦截器事件

/** *阻止鼠标右键  */document.documentElement.oncontextmenu = function(event) {event = event || window.event;if(event.preventDefault){//ffevent.preventDefault();}else{event.returnValue = false;//ie}};



原创粉丝点击