好好学一遍JavaScript 笔记(十一)——事件的类型
一事件的类型: 根据触发事件的事物和事件发生的对象,可将浏览器中发生的事件分成几个类型。DOM标准定义了以下几组事件:
鼠标事件:用户使用鼠标操作时触发; 键盘事件:用户敲击键盘、输入时触发; HTML事件:窗口发生变动或者发生特定的客户端-服务端交互时触发; 突变事件:底层的DOM结构发生改变时触发。
1、鼠标事件 click——用户点击鼠标左键时发生(如果右键也按下则不会发生)。如果焦点在按钮上、敲回车也会触发该事件。 dblclick——用户双击鼠标左键时发生(如果右键也按下则不会发生)。 mousedown——用户点击任意一个鼠标按钮时发生。 mouseout——鼠标指针在某个元素上、且用户正要将其移出元素的边界时发生。 mouseover——鼠标移出某个元素、到另一个元素上时发生。 mouseup——用户松开任意一个按钮时发生。 mousemove——鼠标在某个元素上时持续发生。
<html> <head> <title>事件类型</title><script type="text/javascript">function testEventText(oEvent){var oText = document.getElementById("textId"); oText.value += "\n"+oEvent.type;oText.value += "\n keyCode is " + oEvent.keyCode;oText.value += "\n charCode is " + oEvent.charCode;var keys = [];if(oEvent.shiftKey){keys.push("Shift");}if(oEvent.ctrlKey){keys.push("Ctrl");}if(oEvent.altKey){keys.push("Alt");}oText.value += "\n keys down are " +keys;}</script> </head> <body> <textarea id="textId" rows="30" cols="100"></textarea> <br/> <textarea id="textKeyId" onkeydown="testEventText(event);" onkeypress="testEventText(event);" onkeyup="testEventText(event);" rows="30" cols="100"></textarea> <br/> </body></html> 2.2顺序 用户按一次某字符键时、会按以下顺序发生事件:
(1)keydown;
(1)keypress;
(2)keyup.
如果用户按一次某非字符键(例如Ctrl)、会按以下顺序发生事件:
(1)keydown;
(2)keyup.
如果用户按下一个字符键且不放、keydown和keypress事件将逐个持续(keydown先触发)触发、直到松开按键;如果用户按下非字符按键且不放、将只有keydown事件持续触发。
3、HTML事件load事件——页面完全载入后、在window对象上触发;所有的框架都载入后、在框架集上触发;<img/>完全载入后、在其上触发;或者对于<object/>元素、当其完全载入后在其上触发。unload事件——页面完全卸载后、在window对象上触发;所有的框架都卸载后、在框架集上触发;<img/>完全卸载后、在其上触发;或者对于<object/>元素、当其完全卸载、在其上触发。abor事件——用户停止下载过程时、如果<object/>对象还未完全载入、就在其上触发。error事件——javaScript脚本出错时、在window对象上触发;某个<img/>的指定图像无法载入时、在其上触发;或<object/>元素无法载入时触发;或者框架集中的一个或多个框架无法载入时触发。select事件——用户选择了文本框中的一个或多个字符时触发(<input/>或者<textarea/>)。change事件——文本框(<input/>或者<textarea/>)失去焦点时并且在它获取焦点后内容发生过改变时触发;某个<select/>元素的值发生改变时触发。submit事件——点击提交按钮(<input type="submit" />)时、在<form/>上触发。reset事件——点击重置按钮(<input type="reset" />)时、在<form/>上触发。resize事件——窗口或者框架的大小发生改变时触发。scroll事件——用户在任何带滚动条的元素上卷动它时触发。<body/>元素包含载入页面的滚动条。focus事件——任何元素或者窗口本身获取焦点时(用户点击它、Tab键切换到它或者任何其他与它交互的手段)触发。blur事件——任何元素或者窗口本身失去焦点时触发。
HTML事件下篇详细在写......