JavaScript中的跨浏览器事件操作的基本方法整理
程序员文章站
2023-11-26 12:20:16
绑定事件
eu.addhandler = function(element,type,handler){
//dom2级事件处理,ie9也支持
i...
绑定事件
eu.addhandler = function(element,type,handler){ //dom2级事件处理,ie9也支持 if(element.addeventlistener){ element.addeventlistener(type,handler,false); } else if(element.attachevent){ //type加'on' //ie9也可以这样绑定 element.attachevent('on' + type,handler); } //dom0级事件处理步,事件流也是冒泡 else{ element['on' + type] = handler; } };
取消绑定事件
和绑定事件的处理基本一致,有一个注意点:
传入的handler必须与绑定事件时传入的相同(指向同一个函数)
eu.removehandler = function(element,type,handler){ if(element.removeeventlistener){ element.removeeventlistener(type,handler); } else if(element.attachevent){ element.detachevent('on' + type,handler); } else{ //属性置空就可以 element['on' + type] = null; } };
跨浏览器添加事件
function addevent(obj,type,fn){ if(obj.addeventlistener){ obj.addeventlistener(type,fn,false); }else if(obj.attachevent){//ie obj.attchevent('on'+type,fn); } }
跨浏览器移除事件
function removeevent(obj,type,fn){ if(obj.removeeventlistener){ obj.removeeventlistener(type,fn,false); }else if(obj.detachevent){//兼容ie obj.detachevent('on'+type,fn); } }
跨浏览器阻止默认行为
function predef(ev){ var e = ev || window.event; if(e.preventdefault){ e.preventdefault(); }else{ e.returnvalue =false; } }
跨浏览器获取目标对象
function gettarget(ev){ if(ev.target){//w3c return ev.target; }else if(window.event.srcelement){//ie return window.event.srcelement; } }
跨浏览器获取滚动条位置
//跨浏览器获取滚动条位置,sp == scroll position function getsp(){ return{ top: document.documentelement.scrolltop || document.body.scrolltop, left : document.documentelement.scrollleft || document.body.scrollleft; } }
跨浏览器获取可视窗口大小
function getwindow () { if(typeof window.innerwidth !='undefined') { return{ width : window.innerwidth, height : window.innerheight } } else{ return { width : document.documentelement.clientwidth, height : document.documentelement.clientheight } } },
推荐阅读
-
JavaScript中的跨浏览器事件操作的基本方法整理
-
Javascript中字符串和数字的操作方法整理
-
JavaScript中的跨浏览器事件操作的基本方法整理
-
Lua中操作字符串的基本方法整理
-
Javascript中字符串和数字的操作方法整理
-
IE浏览器中图片onload事件无效的解决方法_javascript技巧
-
JavaScript跨浏览器获取页面中相同class节点的方法_javascript技巧
-
JavaScript跨浏览器获取页面中相同class节点的方法_javascript技巧
-
javascript高级程序设计第二版第十二章事件要点总结(常用的跨浏览器检测方法)_javascript技巧
-
javascript中的dom基本操作方法汇总