首页 > 代码库 > html页面中event的常见应用
html页面中event的常见应用
一:获取键盘上某个按键的unicode值
1 <html> 2 <head> 3 <script type="text/javascript"> 4 function whichButton(event) 5 { 6 alert(event.keyCode) 7 } 8 9 </script>10 </head>11 12 <body onkeyup="whichButton(event)">13 <p><b>注释:</b>在测试这个例子时,要确保右侧的框架获得了焦点。</p>14 <p>在键盘上按一个键。消息框会提示出该按键的 unicode。</p>15 </body>16 17 </html>
二:请在页面内点击鼠标的按键。判断你点击的是哪个键
1 <html> 2 <head> 3 <script type="text/javascript"> 4 function whichButton(event) 5 { 6 var btnNum = event.button; 7 if (btnNum==2) 8 { 9 alert("您点击了鼠标右键!")10 }11 else if(btnNum==0)12 {13 alert("您点击了鼠标左键!")14 }15 else if(btnNum==1)16 {17 alert("您点击了鼠标中键!");18 }19 else20 {21 alert("您点击了" + btnNum+ "号键,我不能确定它的名称。");22 }23 }24 </script>25 </head>26 27 <body onm ousedown="whichButton(event)">28 <p>请在文档中点击鼠标。一个消息框会提示出您点击了哪个鼠标按键。</p>29 </body>30 31 </html>
三:获取光标的坐标(相对于当前文档)
1 <html> 2 <head> 3 <script type="text/javascript"> 4 function show_coords(event) 5 { 6 x=event.clientX 7 y=event.clientY 8 alert("X 坐标: " + x + ", Y 坐标: " + y) 9 }10 </script>11 </head>12 13 <body onm ousedown="show_coords(event)">14 15 <p>请在文档中点击。一个消息框会提示出鼠标指针的 x 和 y 坐标。</p>16 17 </body>18 </html>
四:相对于屏幕光标的坐标
1 <html> 2 <head> 3 4 <script type="text/javascript"> 5 function coordinates(event) 6 { 7 x=event.screenX 8 y=event.screenY 9 alert("X=" + x + " Y=" + y)10 }11 12 </script>13 </head>14 <body onm ousedown="coordinates(event)">15 16 <p>17 在文档中点击某个位置。消息框会提示出指针相对于屏幕的 x 和 y 坐标。18 </p>19 20 </body>21 </html>
五:获取事件触发的类型
1 <html> 2 <head> 3 <script type="text/javascript"> 4 function getEventType(event) 5 { 6 alert(event.type); 7 } 8 </script> 9 </head>10 11 <body onm ousedown="getEventType(event)">12 13 <p>在文档中点击某个位置。消息框会提示出被触发的事件的类型。</p>14 15 </body>16 </html>
六:当输入完搜索条件,直接点击回车键触发搜索的js方法
1 <li>用户名:<input type="text" class="dfinput" id="queryName" onkeyup="if(event.keyCode==13) queryByName();" value="http://www.mamicode.com/${queryName }" style="width: 200px;"></li>2 <li><input type="button" class="scbtn" onclick="queryByName();" value="http://www.mamicode.com/查询"/></li>
sdfa
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。