Image placeholder

jwerty – 一个处理键盘事件的 JavaScript 库

Image placeholder
F2EX 2017-09-21

jwerty 是一个处理键盘事件的 JavaScript 库,它允许你绑定,触发和声明组合字符串与元素和事件的对应关系。它将 api 标准化成易于使用和清除的东西。

jwerty 是一个轻量级,压缩后约 1.5kb(〜3kb压缩)。jwerty 没有依赖关系,但它与 jQuery,Zepto,Ender 或 CanJS 兼容。你可以通过 npm(与Ender一起使用)或 Bower 来安装 jwerty 。

用法

使用 `jwerty.key` 将你的回调绑定到一个按键组合(全局快捷方式)

jwerty.key('ctrl+shift+P', function () { [...] });
jwerty.key('⌃+⇧+P', function () { [...] });

指定可选按键

jwerty.key('⌃+⇧+P/⌘+⇧+P', function () { [...] });

按键序列

jwerty.key('↑,↑,↓,↓,←,→,←,→,B,A,↩', function () { [...] });

正则表达式的按键范围

jwerty.key('ctrl+[0-9]', function () { [...] });

混合

jwerty.key('ctrl+[0-9],f/h', function () { [...] });

通过一个上下文来绑定你的回调

jwerty.key('⌃+⇧+P/⌘+⇧+P', function () { [...] }, this);

通过选择器来绑定该元素的本地快捷方式

jwerty.key('⌃+⇧+P/⌘+⇧+P', function () { [...] }, this, '#myinput');

通过选择器上下文,类似于 jQuery 的 $(‘selector’,’scope’)

jwerty.key('⌃+⇧+P/⌘+⇧+P', function () { [...] }, this, 'input.email', '#myForm');

如果绑定到选择器,你也可以省略函数上下文

jwerty.key('⌃+⇧+P/⌘+⇧+P', function () { [...] }, 'input.email', '#myForm');

使用 `jquery.event` 作为装饰器,以自己的方式绑定事件

$('#myinput').bind('keydown',  jwerty.event('⌃+⇧+P/⌘+⇧+P', function () { [...] }));

使用 `jwerty.is` 来检查键盘的连续按键事件

function (event) {
    if ( jwerty.is('⌃+⇧+P', event) ) {
        [...]
    }
}

使用 `jwerty.fire` 将键盘事件发送到其他地方

jwerty.fire('enter', 'input:first-child', '#myForm');

特殊字访问的唯一按键

jwerty.key('enter+ctrl+alt+shift+plus')

2017-09-21