1、shortcut.js
下载地址:http://www.openjs.com/scripts/events/keyboard_shortcuts/shortcut.js
下面内容主要为官方文档的翻译,但也加入了一些我的理解。
使用说明
该类主要有两个方法组成:shortcut.add()、shortcut.remove(),下面分别介绍:
shortcut.add(key,func,options)
该方法有三个参数:
key :要设置的快捷键,比如”CTRL+A”,书写形式为 :功能键[+功能键..]+其他键。详情见下面支持键列表;
func: 响应快捷键的函数,当快捷键按下时,将执行该函数;
options: 配置参数,以关联数组形式填写,参数包括下面几个:
type – String
事件类型 – 可以是’keydown’,'keyup’,'keypress’。默认为 ‘keydown’
disable_in_input – Boolean
是否在输入表单时屏蔽快捷键 – 如果该项设置为true,当光标焦点在input或textarea时,快捷键将屏蔽。这项功能是非常有用的,特别是当我们设置的快捷键只需按一个键时。该项默认为false
target – DOM Node
响应快捷键的元素范围。默认为 : document
propagate – Boolean
是否允许继承? 默认 : false
keycode – Integer
监视的键盘编码。比如, 编码’65′ 为按键 ‘a’.
options参数示例:
1 |
{ |
2 |
'type':'keydown', |
3 |
'propagate':false, |
4 |
'disable_in_input':true, |
5 |
'target':document, |
6 |
'keycode':65 |
7 |
} |
示例:
1 |
shortcut.add("Ctrl+B",function() { |
2 |
alert("The bookmarks of your browser will show up after this alert..."); |
3 |
},{ |
4 |
'type':'keydown', |
5 |
'propagate':true, |
6 |
'target':document |
7 |
}); |
shortcut.remove()
只有一个参数,即前面设置的的快捷键组合。确保跟前面设置的快捷键组合是一样的,比如我们前面shortcut.add()的第一个参数为“CTRL+A”,此处也必须为“CTRL+A”。
示例:
1 |
shortcut.add("Ctrl+B",function() { |
2 |
alert("Bold"); |
3 |
}); |
4 |
//Remove the shortcut |
5 |
shortcut.remove("Ctrl+B"); |
支持的键:
快捷键必须是下面的形式:
功能键[+功能键..]+其他键
比如:
Ctrl+A
支持的功能键有
* Ctrl
* Alt
* Shift
* Meta
功能键可以省略,比如设置快捷键X:
1 |
shortcut.add("X",function() { |
2 |
alert("Hello!"); |
3 |
}); |
其他允许的键:
* 所有数字、字母键 – abc…xyz,01..89
* 特殊字符-任何标准键盘上的特殊字符都可以
* 特殊按键…
o Tab
o Space
o Return
o Enter
o Backspace
o Scroll_lock
o Caps_lock
o Num_lock
o Pause
o Insert
o Home
o Delete
o End
o Page_up
o Page_down
o Left
o Up
o Right
o Down
o F1
o F2
o F3
o F4
o F5
o F6
o F7
o F8
o F9
o F10
o F11
o F12
所有这些按键都是不区分大小写的,可以放心填写。
2、Kibo
Kibo是一个简单的用于处理键盘事件的Javascript工具库。
入门
Kibo不依赖任何东西。你只要把它放到你的HTML代码里就行了:
<script type="text/javascript" src="kibo.js"></script>
创建一个Kibo对象实例,事件监听器就建立起来了:
var k = new Kibo();
Kibo对象的构造器有一个可选参数——你指定的接收事件的HTML元素。可以是input, textarea 或 select,缺省情况下是window.document。
语法和用法
本工具库提供了两个简单的方法——down and up, 它们都接收两个参数:一个按键或多个按键的组合或通配符,以及一个当有匹配的按键事件发生时调用的函数。这两个方法都可以链式调用。
按键组合是指控制键和字符键的组合,或者简单的是一个或多个控制键。你可以向这两个方法传入单个或一个数组形式的多个组合键。
当函数被调用时,事件将被传入这个函数。如果你的事件没有什么操作,忽略就行了。如果函数返回了false,事件的缺省操作将被阻止。
Kibo里提供了一个lastKey方法,用来查询最后一次键盘事件是由什么键产生的。它会返回键的名称,如果在最后的一次按键是不支持的键,方法将返回undefined。除此之外,你还可以用lastKey判断是否是某个特定的功能键被按下,它会要么返回true 要么返回 false。
受支持的按键
Kibo 支持下面的这些按键,拼写这些按键名时不区分大小写:
-
控制键
shift,ctrl,alt -
字母键 从
a到z -
数字键 从
0到9 -
功能键 从
f1到f12 -
方向键
left,up,right,down -
enter,esc,space,backspace,delete,insert,tab,page_up,page_down,home,end,caps_lock,num_lock -
通配符
any,any arrow,any number,any letter,any f
例子
var k = new Kibo();
单键或多键组合
k.down(['up', 'down'], function() {
console.log('up or down arrow key pressed');
}).up('tab', function() {
console.log('TAB key released');
});
含有控制键的组合键
function handler() {
console.log('last key: ' + k.lastKey());
}
k.down(['shift q', 'ctrl alt x'], handler);
通配符
k.down(['any letter', 'any number'], function() {
console.log('letter or number key pressed');
console.log('shift key was' + (k.lastKey('shift') ? '' : ' not') + ' pressed');
});
k.up('any', function() {
console.log('key released');
});
阻止缺省事件
k.down('f5', function() { return false; });
License
Kibo is released under the MIT License.
3、KeyboardJS
又是一款很不错的JS,直接见demo:

浙公网安备 33010602011771号