zoukankan      html  css  js  c++  java
  • js鼠标事件、键盘事件实例代码

    讲述了:鼠标的哪个按键被点击、当前鼠标的光标坐标是多少、被按下键的unicode码是多少、当前鼠标的光标相对于屏幕的坐标是多少、当前鼠标的光标坐标是多少、shift键是否按下、当前被点击的是哪一个元素

    1. 鼠标的哪个按键被点击?

    <html> 
    <head> 
    <script type="text/javascript"> 
    function whichButton(event) 
    { 
    if (event.button==2) 
    { 
    alert("你点击了鼠标右键!") 
    } 
    else 
    { 
    alert("你点击了鼠标左键!") 
    } 
    } 
    </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>在此文档中按下你鼠标的左键看看!</p> 
    
    </body> 
    </html> 
    

     3. 被按下键的unicode码是多少?

    <html> 
    <head> 
    <script type="text/javascript"> 
    function whichButton(event) 
    { 
    alert(event.keyCode) 
    } 
    
    </script> 
    </head> 
    
    <body onkeyup="whichButton(event)"> 
    <p>在此文档中按下你键盘上的某个键看看</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> 
    点击你鼠标的左键 
    </p> 
    
    </body> 
    </html> 
    

     5. 当前鼠标的光标坐标是多少?

    <html> 
    <head> 
    
    <script type="text/javascript"> 
    function coordinates(event) 
    { 
    x=event.x 
    y=event.y 
    alert("X=" + x + " Y=" + y) 
    } 
    
    </script> 
    </head> 
    <body onmousedown="coordinates(event)"> 
    
    <p> 
    点击你鼠标的左键 
    </p> 
    
    </body> 
    </html> 
    

     6. shift键是否按下?

    <html> 
    <head> 
    <script type="text/javascript"> 
    function isKeyPressed(event) 
    { 
      if (event.shiftKey==1) 
        { 
        alert("shit键按下了!") 
        } 
      else 
        { 
        alert("shit键没有按下!") 
        } 
      } 
    </script> 
    </head> 
    
    <body onmousedown="isKeyPressed(event)"> 
    
    <p>按下shit键,点击你鼠标的左键</p> 
    
    </body> 
    </html> 
    

     7. 当前被点击的是哪一个元素?

    <html> 
    <head> 
    <script type="text/javascript"> 
    function whichElement(e) 
    { 
    var targ 
    if (!e) var e = window.event 
    if (e.target) targ = e.target 
    else if (e.srcElement) targ = e.srcElement 
    if (targ.nodeType == 3) // defeat Safari bug 
       targ = targ.parentNode 
    var tname 
    tname=targ.tagName 
    alert("你点击了 " + tname + "元素") 
    } 
    </script> 
    </head> 
    
    <body onmousedown="whichElement(event)"> 
    <p>在这里点击看看,这里是p</p> 
    
    
     
    <h3>或者点击这里也可以呀,这里是h3</h3> 
    <p>你想点我吗??</p> 
    <img border="0" src="../myCode/btn.gif" width="100" height="26" alt="pic"> 
    </body> 
    
    </html> 
    
  • 相关阅读:
    HDU 4278 Faulty Odometer 8进制转10进制
    hdu 4740 The Donkey of Gui Zhou bfs
    hdu 4739 Zhuge Liang's Mines 随机化
    hdu 4738 Caocao's Bridges tarjan
    Codeforces Gym 100187M M. Heaviside Function two pointer
    codeforces Gym 100187L L. Ministry of Truth 水题
    Codeforces Gym 100187K K. Perpetuum Mobile 构造
    codeforces Gym 100187J J. Deck Shuffling dfs
    codeforces Gym 100187H H. Mysterious Photos 水题
    windows服务名称不是单个单词的如何启动?
  • 原文地址:https://www.cnblogs.com/phpyangbo/p/js-shubiao-jianpan.html
Copyright © 2011-2022 走看看