JAvascriptマウスボタンとキーボードボタンを判断する方法

1565 ワード

ウェブサイトのフロントエンドの設計の時、キーボードを通じて(通って)ページの状態の変化を制御して、例えばup、down、pageUp、pageDownなどはウェブサイトのスクロールを行います.現在、html 5の発展は新しいゲーム体験をもたらしているため、ボタン操作は少なくない.
1.マウスボタンを監視します.
任意のキー操作には必ずリスナーと応答者がいるため、マウスボタンも例外ではありません.jsイベント操作では、onMousedownはマウスボタン操作を傍受するために使用されます.
<!--demo.html-->
<html>
<head>
<title>js     、 、       -   </title>
<script type="text/javascript">
function mouseClick(event)
{
    var mouseBtnNo = event.button;
    
    if (mouseBtnNo==2)
    {
        alert("        !")
    }
    else if(mouseBtnNo==0)
    {
        alert("        !")
    }
    else if(mouseBtnNo==1)
    {
        alert("        !");
    }
    else
    {
        alert("    " + mouseBtnNo+ "  ,         ,      ");
    }
}

</script>
</head>

<body>
<p>         。                   。</p>
<div style="height:200px;width:200px;background-color:#920" onmousedown="mouseClick(event)" >
   <!--click me-->
</div>
</body>

</html>

2.キーボードボタンの傍受
<script type="text/javascript">
function keyDown() { 
   var value= event.keyCode 
   var key = String.fromCharCode(event.keyCode) 
   alert "  : " + key + " : " + value ) 
  } 
 // document.onkeydown = keyDown;
 //document.body[0].onKeydown = keyDown;
 document.getElementById('canvas').onKeyDown = keyDown;
 </script>

主流の応用範囲:html 5では、ボタンを使ってゲーム中の精霊、背景などの要素の移動を制御します.
try doing it;