文档04_JavaScript_事件

  常用事件

事件名称	含义	作用对象	详细说明
onClick	鼠标单击	link、button、submit、reset、form、image	已经很熟悉，如单击按钮、图片、文本框、列表框等
onChange	内容发生改变	input、select和多行文本框（textarea）	如文本框的内容发生改变
onBlur	失去焦点	window、frame所有表单对象（比如按钮、单选框）	当光标从某一控件移出时产生
onFoucs	获得焦点	window、frame所有表单对象（比如按钮、单选框）	如单击文本框时，该文本框就获得焦点（鼠标），产生onFocus（获得焦点）事件
onMouseOver	鼠标悬停事件	link、链接中的图像	当移动鼠标，停留在图片或文本框等的上方，就产生onMouseOver（鼠标悬停）事件
onMouseOut	鼠标移出事件	link、链接中的图像	当移动鼠标，离开图片或文本框的区域，就产生onMouseOut（鼠标移出）事件
onMouseMove	鼠标移动事件	link、链接中的图像	当鼠标在图片或层<DIV>、<SPAN>等HTML元素上方移动时，将产生onMouseMove（鼠标移动）事件
事件名称	含义	作用对象	详细说明
onLoad	页面加载事件	body、frameset、image	HTML网页从网站服务器下载到本机后，需要浏览器加载到内存中，然后解释执行并显示。浏览器加载HTML网页时，将产生onLoad（页面加载）事件
onUnload	页面关闭事件	body、frameset	当文档被关闭或重置时调用
onMouseDown	鼠标按下事件	link、链接中的图像	当用户用任何鼠标按键单击对象时触发
onMouseUp	鼠标弹起事件	link、链接中的图像	当用户在鼠标位于对象之上时，释放鼠标按键时触发
onResize	窗口大小改变事件	window	当用户改变窗口大小时产生，如窗口最大化、窗口最小化、用鼠标拖动改变窗口大小等时

示例，检测事件对象

function Mousedown(event)

{

var theEvent=event?event:window.event;

alert("X:"+theEvent.screenX+"Y:"+theEvent.screenY);

}

document.onmousedown=Mousedown;

Event对象属性（可以跨浏览器）

function getEvent(eventObj)

{

return eventObj?eventObj : window.event;

}

altKey boolean类型  用来返回事件触发时Alt键是否按下

ctrlKey boolean类型  用来返回事件触发时ctrl键是否按下

clientX  事件触发时客户端的当前X坐标

clientY  事件触发时客户端的当前Y坐标

keyCode  用来表示当前按键的代码（数值）

screenX  事件触发时屏幕的X轴坐标

screenY  事件触发时屏幕的Y轴坐标

shiftKey  boolean类型 用来表示事件触发时Shfit键是否按下

Type 事件类型

 

 

This关键字表示当前调用的函数或者方法的所有者，可以在当前的函数中使用

DOM Level 2 事件

//添加事件

eventObj.addEventListener("事件类型",函数名,boolean);//添加事件监听，false表示以冒泡的方式处理，true表示以捕获的方式处理，other浏览器

removeEventListener：删除事件监听

dispatchEventListener：分发一个新的事件监听

 

attachEvent("事件类型"，函数名)//添加事件，IE中

 

//说明：K 跨浏览器兼容事件处理

//参数：eventObj事件对象，eventName事件类型，eventHandler事件句柄/函数名

//返回：无

function catchEvent(eventObj,eventName,eventHandler)

{

if(eventObj.addEventListener)//other

{

//false以冒泡方式处理，true以捕获方式处理

eventObj.addEventListener(eventName,eventHandler,false);//eventObj.addEventListener("click",函数名,false);

}else if(eventObj.attachEvent)//IE

{

eventName="on"+event;

eventObj.attachEvent(eventName,eventHandler);

}

}

 

History:历史记录

Navigator:浏览器相关信息

Screen:屏幕信息

Location:页面位置，常用的属性：href、hostname、host

 

定时器

执行一次，setTimeout(函数句柄,时间毫秒数，参数1，参数2)注意在IE里面不支持在后面传递参数、clearTimeout，删除定时器，参数是该定时器的句柄

周期性执行，setInterval(函数句柄,时间毫秒数)

注意

带参数方法使用setTimeout要注意，setTimeout("函数名("+参数+")",毫秒数)，这里的参数只能字符串形式的，而不能传递一个对象，网上很多朋友也在问此类问题

 

 

练习代码文档下载