1、键盘监控事件onkeydown
onkeydown事件会在用户按下一个键盘按键时发生。
window.onkeydown = function(e){
// 表示键盘监听所触发的事件,同时传入参数e
var e = e || window.e;
console.log(e.keycode);
// 输出键盘编码
}
该函数应该在何处监听呢?一开始我是将函数放置在drawTank()里面,监听失败;一开始想的是:在绘制坦克的时候监听,本以为没有错,反复打断点、检查语法错误,一直在钻牛角尖,纠结了好几个小时。无意将函数放在rAF模型中,竟然成功了。对啊,其实绘制坦克的过程只是一个加载图片,确定x,y坐标的过程,是一个独立的函数,而监听事件则应该是在动画反复绘制的过程中去监听。
写代码的时候不能死脑筋,灵活些。
2、按下方向键页面的滚动条不跟着一起联动
Js在处理按下上下左右按键的坦克四个方向移动问题的时候,出现了相应的滚动条也随之移动的问题,
Js阻止默认事件的方式:
使用e.preventDefault()
方法,例子如下:
window.onkeydown = function(e){
var e = e || window.event;
if(e.keyCode == 37){
e.preventDefault();
tank.dir_l = 1; // 左箭头
}
}
注意:e对象的获取方式在IE和标准浏览器是不同的;
补充:
按键失效(不会有任何反应):
window.onkeydown = function(e){
var e = e || window.event;
if(e.keyCode == 37){
return false;
}
}