在编写前端程序的时候需要与用户进行键盘交互,如果自己写检测用户按键代码,会造成各个不同浏览器的兼容性问题。

我们可以使用jQuery Hotkeys plugin这个Jquery库来实现效果,以兼容不同的浏览器。jQuery Hotkeys plugin的GitHub。

大致的代码:

对某个键或组合键绑定函数:$.hotkeys.add('键名', function(){ 要实现的目的});

//键名可以是单键,也可以是组合键例如:Ctrl+c

取消绑定的函数:$.hotkeys.remove('键名');

其他用法:

检测用户是否按下某一个按钮:$(function () {

window.keydown = {};

function keyName(event) {

return jQuery.hotkeys.specialKeys[event.which] ||

String.fromCharCode(event.which).toLowerCase();

}

$(document).bind("keydown", function (event) {

keydown[keyName(event)] = true;

});

$(document).bind("keyup", function (event) {

keydown[keyName(event)] = false;

});

});

使用的时候:if(keydown.space)

alert("您按下了空格键");

if(keydown.left)

alert("您按下了左键");

Logo

开放原子开发者工作坊旨在鼓励更多人参与开源活动,与志同道合的开发者们相互交流开发经验、分享开发心得、获取前沿技术趋势。工作坊有多种形式的开发者活动,如meetup、训练营等,主打技术交流,干货满满,真诚地邀请各位开发者共同参与!

更多推荐