1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="UTF-8"> 5 <title></title> 6 </head> 7 <script type="text/javascript"> 8 9 window.onload=function(event) 10 { 11 /* 12 键盘事件 13 onkeydown 按键被按下 14 对于onkeydown来说如果按着某个按键不松手，则事件就会一直触发 15 当onkeydown连续触发时，第一次和第二次之间会间隔稍微长一点，其他的会非常的快 16 17 onkeyup 按键被松开 18 19 键盘事件一般都会绑定给一些可以获取到焦点的对象或者是document 20 */ 21 document.onkeydown=function(event){ 22 event=event||window.event; 23 /* 24 可以通过keyCode来获取按键的编码 通过它可以判断哪个按键被按下 25 除了keyCode,事件对象中还提供了几个属性 26 altKey 27 ctrlKey 28 shiftKey 29 这个三个用来判断alt ctrl 和 shift 是否被按下 30 如果按下则返回true，否则返回false 31 */ 32 console.log(event.keyCode); 33 //判断一个y是否被按下 34 if(event.keyCode===89) 35 console.log("y被按下了"); 36 //判断y和ctrl是否同时被按下 37 if(event.keyCode===89&&event.ctrlKey){ 38 console.log("ctrl和y同时被按下");//获取input 39 } 40 }; 41 var input=document.getElementsByTagName("input")[0]; 42 input.onkeydown=function(event){ 43 event=event||window.event; 44 console.log("按键被按下了"); 45 /* 46 在文本框中输入内容，属于onkeydown的默认行为 47 如果在onkeydown中取消了默认行为，则输入的内容，不会出现在文本框中 48 */ 49 //return false; 50 //使文本框不能输入数字 51 if(event.keyCode>=48&&event.keyCode<=57){ 52 return false; 53 } 54 }; 55 56 document.onkeyup=function(){ 57 58 }; 59 }; 60 </script> 61 <style type="text/css"> 62 </style> 63 <body> 64 <input type="text"/> 65 <div style="100px;height:100px;background-color:red;"></div> 66 </body> 67 </html>