js经典案例

#js经典案例| 来源: 网络整理| 查看: 265

一、跨浏览器添加事件\移除

function addEvent(eventObj,tyoe,fn){ if(eventObj.addEventListener){ eventObj.addEventListener(type,fn,false) }else if(eventObj.attachEvent){ eventObj.attachEvent('on'+type,fn) } } function removeEvent(eventObj,tyoe,fn){ if(eventObj.removeEventListener){ eventObj.removeEventListener(type,fn,false) }else if(eventObj.detachEvent){ eventObj.detachEvent('on'+type,fn) } }

一般浏览器：addEventListener,removeEventlistener;IE浏览器：attachEvent,detachEvent；并且添加的事件类型，IE浏览器需加前缀on

二、跨浏览器阻止默认行为

function prevent(ev){ //取到事件对象 var e = ev||window.event; if(e.preventDefault){ e.preventDefault() }else{ e.returnValue = flase;//for IE } }

三、跨浏览器获取目标对象

function getTarget(ev){ //取到事件对象 if(ev.target){ return ev.target }else if(windoow.event.srcElement){ return window.event.srcElement;//for IE } }

四、阻止表单重复提交

1、提交之后禁用按钮

document.getElementByID("btn").disabled = true;

2、检测已经提交过，取消后续提交操作

var flag=false; //提交后会将flag置为true flag = true; //之后再次点击提交按钮，判断flag是否为true if(flag==true){ return }

五、获取屏幕信息

scrollWidth：对象的实际内容的宽度，不包边线宽度，会随对象中内容超过可视区后而变大。 clientWidth：对象内容的可视区的宽度，不包滚动条等边线，会随对象显示大小的变化而改变。无border offsetWidth：对象整体的实际宽度，包滚动条等边线，会随对象显示大小的变化而改变。有border

1、如何算出浏览器的高度或宽度。

Width=document.documentElement.clientWidth||document.body.clientWidth

height=document.documentElement.clientHeight||document.body.clientHeight

2、屏幕宽度clientWidth和offsetWidth的区别是什么？

clientWidth=width+padding,offsetWidth=width+padding+border

3、如何算浏览器中当前显示的页面的中心点的位置

top=scrollHeight/2;left=scrollWidth/2

【本文地址】

公司简介

联系我们