• 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> 
    
  • 相关阅读:
    字符串转换整数
    list、tuple、dict加*星号
    字符串
    整数反转
    字符串分割函数
    核密度图(直方图的拟合曲线)
    不同缺失值的删除方法
    Z字形变换
    最长回文字串
    寻找两个有序数组的中位数
  • 原文地址:https://www.cnblogs.com/phpyangbo/p/js-shubiao-jianpan.html
Copyright © 2020-2023  润新知