上一篇介绍了Javascript初学者实例教程(1):简单交互
实例二、
本实例主要介绍了event对象和事件的简单应用。
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> <title>mouse</title> <script language="javascript"> function catchEvent() { var eventSrcID = event.srcElement.id; var eventtype = event.type; alert(eventSrcID+"捕获到了"+eventtype+"事件"); } function GetPosition() { var posX = event.clientX; var posY = event.clientY; window.status = "鼠标的位置是("+posX+","+posY+")"; } function GetKey() { textfield.value=event.keyCode+","+String.fromCharCode(event.keyCode); } </script> </head> <body onMouseMove="GetPosition();" > 鼠标在文本框中按下:<input type="text" name="textfield" onMouseDown="alert(''鼠标在文本框中按下'')"><br/> 键盘按下:<input type="text" name="textfield" onKeyDown="alert(''键盘按下'');"><br/> event对象:<br/> <input type="text" name="textfield" id="text" onClick="catchEvent();"><br/> <input type="submit" name="Submit" value="提交" id="button" onClick="catchEvent();"><br/> </body> </html>
效果演示:
|