1.鼠标左中右键事件:
<html> <head> <script type="text/javascript"> function whichButton(event) { var btnNum = event.button; if (btnNum==2) { alert("您点击了鼠标右键!") } else if(btnNum==0) { alert("您点击了鼠标左键!") } else if(btnNum==1) { alert("您点击了鼠标中键!"); } else { alert("您点击了" + btnNum+ "号键,我不能确定它的名称。"); } } </script> </head> <body onmousedown="whichButton(event)"> <p>请在文档中点击鼠标。一个消息框会提示出您点击了哪个鼠标按键。</p> </body> </html>
2.相对于文档光标位置事件:
<html> <head> <script type="text/javascript"> function show_coords(event) { x=event.clientX y=event.clientY alert("X 坐标: " + x + ", Y 坐标: " + y) } </script> </head> <body onmousedown="show_coords(event)"> <p>请在文档中点击。一个消息框会提示出鼠标指针的 x 和 y 坐标。</p> </body> </html>
3.按键unicode:
<html> <head> <script type="text/javascript"> function whichButton(event) { alert(event.keyCode) } </script> </head> <body onkeyup="whichButton(event)"> <p><b>注释:</b>在测试这个例子时,要确保右侧的框架获得了焦点。</p> <p>在键盘上按一个键。消息框会提示出该按键的 unicode。</p> </body> </html>
4.相对于屏幕光标位置:
<html> <head> <script type="text/javascript"> function coordinates(event) { x=event.screenX y=event.screenY alert("X=" + x + " Y=" + y) } </script> </head> <body onmousedown="coordinates(event)"> <p> 在文档中点击某个位置。消息框会提示出指针相对于屏幕的 x 和 y 坐标。 </p> </body> </html>
5.选择文本的事件:
<html> <head> <script type="text/javascript"> function selText() { document.getElementById("myText").select() } </script> </head> <body> <form> <input size="25" type="text" id="myText" value="选定我吧!"> <input type="button" value="选择文本" onclick="selText()"> </form> </body> </html>
6.文本框大于最大长度时跳转至下一文本框:
<html> <head> <script type="text/javascript"> function checkLen(x,y) { if (y.length==x.maxLength) { var next=x.tabIndex if (next<document.getElementById("myForm").length) { document.getElementById("myForm").elements[next].focus() } } } </script> </head> <body> <p>这段脚本在达到文本框的最大长度时跳到下一个文本框:</p> <form id="myForm"> <input size="3" tabindex="1" maxlength="3" onkeyup="checkLen(this,this.value)"> <input size="2" tabindex="2" maxlength="2" onkeyup="checkLen(this,this.value)"> <input size="3" tabindex="3" maxlength="3" onkeyup="checkLen(this,this.value)"> </form> </body> </html>