这是最好的 Javascript 键盘事件库。（热键，快捷方式）[关闭]

Posted 2023-02-19

技术标签:

【中文标题】这是最好的 Javascript 键盘事件库。（热键，快捷方式）[关闭]【英文标题】：which is the best Javascript Keyboard event library.(Hotkeys,Shortcuts ) [closed] 【发布时间】：2011-01-22 03:27:15 【问题描述】：

我想制作一个使用键盘事件的 bbs 论坛，

那么哪个是最好的键盘事件库，

谢谢

【问题讨论】：

“最佳”是一个难以匹配的标准。您可以尝试提供有关您要完成的工作的更多详细信息。这样，我们可以更具体。 【参考方案1】：

只是另一个混音。我最近发布了一款名为 Mousetrap 的产品。你可以在http://craig.is/killing/mice查看示例

【讨论】：

它很容易实现并且工作起来就像一个魅力。在商业项目中使用它的许可证如何？它使用 Apache 2.0 许可证。这是一个很棒的库，但有一个主要缺点：它不允许您指定将事件绑定到的容器。它始终绑定到文档。这就是为什么我必须在我的回调中添加一些额外的焦点检查。（我的网站包含两个元素，每个元素都有不同的绑定。） @Domi - 从 1.5 开始，我相信这个问题现在已经修复简单易用。优雅的功能。小的。插件。太棒了！【参考方案2】：

试试KeyboardJS

就这么简单

KeyboardJS.on('a', function() alert('hello!'); );

又像

一样灵活

var bindInstance = KeyboardJS.on('ctrl + a, ctrl + b, c', function(event, keysPressedArray, keyComboString)

    //you get the event object
    console.log('event object', event);

    //you get the keys pressed array
    console.log('keys pressed', keysPressedArray);

    //you get the key combo string
    console.log('combo pressed', keyComboString);

    console.log('I will fire when \'ctrl + a\' or \'ctrl +b\' or \'c\' is pressed down');

    //block event bubble
    return false;

, function(event, keysPressedArray, keyComboString) 

    console.log('I will fire on key up');

    //block event bubble
    return false;

);

您可以通过调用清除绑定

bindInstance.clear();

您可以使用特定键清除所有绑定

KeyboardJS.clear('a, b');

它是开源的，可在Github 获得。它包含在一个全局库或 RequireJS 的 AMD 模块中。

这是introduction video。

好了，现在不用再担心键盘了，为您的应用编写代码吧。 ;)

【讨论】：

似乎是一个非常棒的脚本，但我可以说它在 IE8 中不起作用，这对我来说是一个可悲的问题（在几个层面上）。当我使用 IE8 转到 robertwhurst.github.com/KeyboardJS 时，它只是说“需要 JS”。演示可能无法在 IE 中运行，但库应该。它在几个版本之前完成了。你试过图书馆本身吗？我没有。我会试一试。演示是否需要展示可以处理所有浏览器的调整？我很乐意在演示页面上分叉和调整并发送拉取请求。那会很有帮助。我真的被我目前的项目淹没了，大麦有时间睡觉。如果您修复演示，我将接受您的拉取请求。这是我测试过的唯一一个真正适合我情况的 4-5 库（div 和 contenteditable="true"）。谢谢@RobertHurst！【参考方案3】：

KEYPRESS 专注于游戏输入，支持任意键作为修饰符，以及其他功能。也是pre-packaged for Meteor。

【讨论】：

【参考方案4】：

据我所知，Mousetrap 是唯一可以让您指定键序列而不是组合的库。这对我的应用程序非常方便。

【讨论】：

其实KeyboardJS也有这个功能。【参考方案5】：

许多 javascript 库都提供了很多方法来捕获关键输入并将其用于您的优势。可以肯定的是，您将能够找到一个库来做到这一点，仅此而已。但是，我在那里没有太多经验。

我已经使用Ext 有一段时间了，他们的KeyMap 类真的很容易使用。这是一个使用它的简单示例。

new Ext.KeyMap(Ext.getDoc(), 
        key: 'abc',
        alt: true,
        handler: function(k, e) 
            var t = Ext.getCmp('tabpanel');
            switch(k) 
                case 65:
                    t.setActiveTab(0);
                    break;
                case 66:
                    t.setActiveTab(1);
                    break;
                case 67:
                    t.setActiveTab(2);
                    break;
            
        ,
        stopEvent: true
    );

这需要 Ext.TabPanel 类，并允许用户按下键盘键来更改选项卡，而不是单击选项卡本身。

当然，它可以做的远不止这些。这是一个简单的例子来说明它是如何工作的。

【讨论】：

【参考方案6】：

这个对于jquery来说还是不错的。

https://github.com/jeresig/jquery.hotkeys

【讨论】：

【参考方案7】：

如果您刚开始并且想了解热键的工作原理，这个会更好。

https://github.com/UthaiahBollera/HotkeysInJavascriptLibrary

【讨论】：

【参考方案8】：