1、1 1目录8.1 事件处理函数8.2 event事件对象8.3 button事件属性8.4 常用事件8.1 事件处理函数u指定事件处理函数的三种方法:u1.直接在 HTML 标记中指定处理语句 格式:标记.事件=事件处理语句 例:u2.直接在 HTML 标记中指定处理函数 格式:例:8.1 事件处理函数u指定事件处理函数的三种方法:u3.通过事件属性进行设置 格式:对象名.on事件=|u例1:udocument.body.onload=window.open(http:/www.shuangxin.org,w1,width=500,height=500);u例2:ufunction show(
2、)uwindow.open(http:/www.shuangxin.org,w1,width=500,height=500);uudocument.body.onload=show;8.2 event事件对象uevent 对象代表事件的状态,比如事件在其中发生的元素、键盘按键的状态、鼠标的位置、鼠标按钮的状态。属性描述altKey返回当事件被触发时,ALT 是否被按下。button返回当事件被触发时,哪个鼠标按钮被点击。clientX返回当事件被触发时,鼠标位置相对于窗体window的水平坐标。clientY返回当事件被触发时,鼠标位置相对于窗体window的垂直坐标。ctrlKey返回当事件
3、被触发时,CTRL 键是否被按下。screenX返回当某个事件被触发时,鼠标位置相对于屏幕显示器的水平坐标screenY返回当某个事件被触发时,鼠标位置相对于屏幕显示器的垂直坐标shiftKey返回当事件被触发时,SHIFT 键是否被按下。8.2 event事件对象uIE浏览器与其他浏览器兼容性问题:u1.window.event|eventu兼容性写法:var oEv=window.event|event;u2.event.srcElement|event.targetu兼容性写法:var oEv=window.event|event;oTarget=oEv.srcElement|oEv.t
4、arget;u3.keyCode|which|charCodeu兼容性写法:var oEv=window.event|event;var currKey=oEv.keyCode|oEv.which|oEv.charCode;8.3 button 事件属性ubutton 事件属性表示当事件发生时,哪个鼠标按钮被点击参数描述0规定鼠标左键。1规定鼠标中键。2规定鼠标右键。8.4 常用事件属性属性说明说明onabort图像的加载被中断。onblur元素失去焦点。onchange域的内容被改变。onclick当用户点击某个对象时调用的事件句柄。ondblclick当用户双击某个对象时调用的事件句柄。o
5、nerror在加载文档或图像时发生错误。onfocus元素获得焦点。onkeydown某个键盘按键被按下。onkeypress某个键盘按键被按下并松开。onkeyup某个键盘按键被松开。onload一张页面或一幅图像完成加载。onmousedown鼠标按钮被按下。onmousemove鼠标被移动。onmouseout鼠标从某元素移开。onmouseover鼠标移到某元素之上。onmouseup鼠标按键被松开。onreset重置按钮被点击。onresize窗口或框架被重新调整大小。onselect文本被选中。onsubmit提交按钮被点击。onunload用户退出页面。Onclick:鼠标的单击
6、事件u单击事件(onclick)是在鼠标单击时被触发的事件。u单击是指鼠标停留在对象上,按下鼠标键,在没有移动鼠标的同时放开鼠标键的这一完整过程。u单击事件一般应用于Button对象、Checkbox对象、Image对象、Link对象、Radio对象、Reset对象和Submit对象,Button对象一般只会用到onclick事件处理程序,因为该对象不能从用户那里得到任何信息,如果没有onclick事件处理程序,按钮对象将不会有任何作用。Onmousedown、onmouseup鼠标的按下或松开事件u鼠标的按下或松开事件分别是onmousedown和onmouseup事件。uonmousedo
7、wn事件用于在鼠标按下时触发事件处理程序uonmouseup事件是在鼠标松开时触发事件处理程序。u在用鼠标单击对象时,可以用这两个事件实现其动态效果。Onmouseover、onmouseout鼠标的移入移出事件u鼠标的移入和移出事件分别是onmouseover和onmouseout事件。uonmouseover事件在鼠标移动到对象上方时触发事件处理程序,uonmouseout事件在鼠标移出对象上方时触发事件处理程序。u可以用这两个事件在指定的对象上移动鼠标时,实现其对象的动态效果。Onmousemove鼠标移动事件u鼠标移动事件(onmousemove)是鼠标在页面上进行移动时触发事件处理程
8、序,可以在该事件中用document对象实时读取鼠标在页面中的位置。键盘事件u键盘事件包含onkeypress、onkeydown和onkeyup事件uonkeypress事件是在键盘上的某个键被按下并且释放时触发此事件的处理程序,一般用于键盘上的单键操作。uonkeydown事件是在键盘上的某个键被按下时触发此事件的处理程序,一般用于组合键的操作。uonkeyup事件是在键盘上的某个键被按下后松开时触发此事件的处理程序,一般用于组合键的操作。实例:获取键盘虚拟码uuOnfocus、onblur获得焦点与失去焦点事件u获得焦点事件(onfocus)是当某个元素获得焦点时触发事件处理程序。u失去
9、焦点事件(onblur)是当前元素失去焦点时触发事件处理程序。u在一般情况下,这两个事件是同时使用的。Onchange修改事件u修改事件(onchange)是当前元素失去焦点并且元素的内容发生改变时触发事件处理程序。u该事件一般在下拉文本框中使用。Onsubmit、onreset表单提交与重置事件u表单提交事件(onsubmit)是在用户提交表单时(通常使用“提交”按钮,也就是将按钮的type属性设为submit),在表单提交之前被触发,因此,该事件的处理程序通过返回false值来阻止表单的提交。该事件可以用来验证表单输入项的正确性。u表单重置事件(onreset)与表单提交事件的处理过程相同,该事件只是将表单中的各元素的值设置为原始值。一般用于清空表单中的文本框。u使用格式:uuformname:表单名称。uFunname:函数名或执行语句,如果是函数名,在该函数中必须有布尔型的返回值。传道,授业,解惑