我很好奇我是如何使用以下jQuery插件代码在这个问题的底部写的,可以实现关键的组合.到目前为止它是如何工作的,它允许用户只需通过正常的jQuery语法创建键命令,并为键命令提供事件,如下所示：
$(window).jkey('a',function(){
alert('you pressed the a key!');
});
要么
$(window).jkey('b c d',function(){
alert('you pressed either the b,c,or d key!');
});
最后我想要的是能力,但无法弄清楚：
$(window).jkey('alt+n',function(){
alert('you pressed alt+n!');
});
我知道如何在插件外部执行此操作(在keyup上设置var false并在keydown上设置var true并检查当你按另一个键时var是否为真),但我不知道如何执行此操作你不知道将要按什么键和多少键.如何添加此支持？我希望能够允许他们做一些事情,比如alt shift a或s d f如果他们想要的话.我无法理解如何实现这一点.有任何想法吗？
我将把它作为一个开源插件发布,我很乐意给予任何给予我权利,工作的人,在博客文章和代码中回答一些信用.提前致谢！
(function($) {
$.fn.jkey = function(keyCombo,callback) {
if(keyCombo.indexOf(' ') > -1){ //If multiple keys are selected
var keySplit = keyCombo.split(' ');
}
else{ //Else just store this single key
var keySplit = [keyCombo];
}
for(x in keySplit){ //For each key in the array...
if(keySplit[x].indexOf('+') > -1){
//Key selection by user is a key combo... what now?
}
else{
//Otherwise,it's just a normal,single key command
}
switch(keySplit[x]){
case 'a':
keySplit[x] = 65;
break;
case 'b':
keySplit[x] = 66;
break;
case 'c':
keySplit[x] = 67;
break;
//And so on for all the rest of the keys
}
}
return this.each(function() {
$this = $(this);
$this.keydown(function(e){
if($.inArray(e.keyCode,keySplit) > -1){ //If the key the user pressed is matched with any key the developer set a key code with...
if(typeof callback == 'function'){ //and they provided a callback function
callback(); //trigger call back and...
e.preventDefault(); //cancel the normal
}
}
});
});
}
})(jQuery);
解决方法
这就是我想出的.基本上我所做的是创建了一个存储所有密钥代码的JSON对象.然后我用代码替换所有提供的密钥.如果键使用”来创建一个键组合,我然后创建一个代码数组.
然后我们创建另一个数组来存储所有被按下的键(keyDown添加项,keyUp将其删除).在keyDown上,我们检查它是单键命令还是组合键.如果它是一个组合,我们会检查所有当前活动的按键.如果它们都匹配,我们执行回调.
这适用于任意数量的关键组合.只有当我使用’alert()’在键组合上显示消息时才会看到它不起作用,因为它将不再从活动的按键阵列中删除项目.
(function($) {
$.fn.jkey = function(keyCombo,callback) {
// Save the key codes to JSON object
var keyCodes = {
'a' : 65,'b' : 66,'c' : 67,'alt' : 18
};
var x = '';
var y = '';
if(keyCombo.indexOf(' ') > -1){ //If multiple keys are selected
var keySplit = keyCombo.split(' ');
}
else{ //Else just store this single key
var keySplit = [keyCombo];
}
for(x in keySplit){ //For each key in the array...
if(keySplit[x].indexOf('+') > -1){
//Key selection by user is a key combo
// Create a combo array and split the key combo
var combo = Array();
var comboSplit = keySplit[x].split('+');
// Save the key codes for each element in the key combo
for(y in comboSplit){
combo[y] = keyCodes[ comboSplit[y] ];
}
keySplit[x] = combo;
} else {
//Otherwise,single key command
keySplit[x] = keyCodes[ keySplit[x] ];
}
}
return this.each(function() {
$this = $(this);
// Create active keys array
// This array will store all the keys that are currently being pressed
var activeKeys = Array();
$this.keydown(function(e){
// Save the current key press
activeKeys[ e.keyCode ] = e.keyCode;
if($.inArray(e.keyCode,keySplit) > -1){ // If the key the user pressed is matched with any key the developer set a key code with...
if(typeof callback == 'function'){ //and they provided a callback function
callback(); //trigger call back and...
e.preventDefault(); //cancel the normal
}
} else { // Else,the key did not match which means it's either a key combo or just dosn't exist
// Check if the individual items in the key combo match what was pressed
for(x in keySplit){
if($.inArray(e.keyCode,keySplit[x]) > -1){
// Initiate the active variable
var active = 'unchecked';
// All the individual keys in the combo with the keys that are currently being pressed
for(y in keySplit[x]) {
if(active != false) {
if($.inArray(keySplit[x][y],activeKeys) > -1){
active = true;
} else {
active = false;
}
}
}
// If all the keys in the combo are being pressed,active will equal true
if(active === true){
if(typeof callback == 'function'){ //and they provided a callback function
callback(); //trigger call back and...
e.preventDefault(); //cancel the normal
}
}
}
}
} // end of if in array
}).keyup(function(e) {
// Remove the current key press
activeKeys[ e.keyCode ] = '';
});
});
}
})(jQuery);
