键盘快捷键与jQuery

如果有人按下字母g，我怎么能连线一个事件？

（所有字母的字符映射在哪里？）

Answer 1

由于这个问题最初被问到，John Resig（jQuery的主要作者）已经分解和改进了js-hotkeys项目。 他的版本可在：

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

Answer 2

怎么样jQuery热键 ？

jQuery Hotkeys让你可以在代码中的任何地方观看键盘事件，支持几乎所有的组合键。

要将Ctrl + c绑定到函数（ f ），例如：

 $(document).bind('keydown', 'ctrl+c', f); 

Answer 3

我最近为此写了一个独立的库。 它不需要jQuery，但你可以使用它与jQuery没有问题。 这就是所谓的捕鼠器。

你可以查看http://craig.is/killing/mice

Answer 4

那么有很多方法。 但我猜你对高级实现感兴趣。 几天前，我在同一个search，我find了一个。

这里。

从键盘捕捉事件是很好的，你也可以findangular色地图。 好东西是…这是jQuery。 检查在同一页面上的演示，并决定。

另一个图书馆在这里 。

Answer 5

  <script type="text/javascript"> $(document).ready(function(){ $("#test").keypress(function(e){ if (e.which == 103) { alert('g'); }; }); }); </script> <input type="text" id="test" /> 

这个网站说71 =克，但上面的jQuery代码认为，否则

资本G = 71 ，小写字母是103

Answer 6

如果你只想简单的快捷方式（比如1个字母，比如说只是g ），你可以很容易地做到这一点，而不需要额外的插件：

 $(document).keypress(function(e) { if(e.charCode == 103) { // Your Code } }); 

Answer 7

你也可以尝试shortKeys jQuery插件。 用法示例：

 $(document).shortkeys({ 'g': function () { alert('g'); } }); 

Answer 8

在Codeacademy学习了一些jQuery之后，我发现了一个解决scheme，将一个键与animation属性绑定在一起。 整个想法是animation而不滚动从一个部分跳到另一个部分。 Codeacademy的例子是通过DOM移动马里奥，但我申请了我的网站部分（CSS 100％的高度）。 这是代码的一部分：

 $(document).keydown(function(key) { switch(parseInt(key.which, 10)) { case 39: $('section').animate({top: "-=100%"}, 2000); break; case 37: $('section').animate({top: "+=100%"}, 2000); break; default: break; } }); 

我想你可以用它来处理任何信件和财产。

来源： http : //www.codecademy.com/forum_questions/50e85b2714bd580ab300527e

Answer 9

有一个新版本的hotKeys.js与1.10+版本的jQuery一起使用。 这是一个小的，100行的JavaScript文件。 4kb或仅2kb的缩小。 这里有一些简单的用法示例是：

 $('#myBody').hotKey({ key: 'c', modifier: 'alt' }, doSomething); $('#myBody').hotKey({ key: 'f4' }, doSomethingElse); $('#myBody').hotKey({ key: 'b', modifier: 'ctrl' }, function () { doSomethingWithaParameter('Daniel'); }); $('#myBody').hotKey({ key: 'd', modifier :'shift' }, doSomethingCool); 

从github克隆回购： https ： //github.com/realdanielbyrne/HoyKeys.git或去github回购页https://github.com/realdanielbyrne/HoyKeys或fork和贡献。;

Answer 10

类似@craig，我最近build立了一个快捷方式库。

blainekasten/shortcut.html

支持多function的可链接API绑定到一个快捷方式。

Answer 11

我已经让你成为关键新闻！ 这是我的代码：

 <h1>Click inside box and press the g key! </h1> <script src="shortcuts.html"> </script> <script> shortcut.add("g",function() { alert("Here Is Your event! Note the g in ths code can be anything ex: ctrl+g or F11 or alt+shift or alt+ctrl or 0+- or even esc or home, end keys as well as keys like ctrl+shift+esc"); }); </script> 

Answer 12

我正在尝试做同样的事情，我很长一段时间后完成了！ 这是我最终使用的代码！ 它的作品：完美！ 这是通过使用shortcuts.js库完成的！ 加了一些其他的按键为例！

只需运行代码snip-it，点击里面的框并按下G键！

注意ctrl + F和meta + F将禁用所有键盘快捷键，所以你必须在同一个脚本中创build键盘快捷键！ 也只能在javascript调用键盘快捷键操作！

要将html转换为javascript ， php或ASP.net请转到此处 ！ 在活JSFIDDLE中查看我所有的键盘快捷键

更新

  <h1>Click inside box and press the <kbd>G</kbd> key! </h1> <script src="shortcuts.html"> </script> <script> shortcut.add("g",function() { alert("Here Is Your event from the actual question! This Is where you replace the command here with your command!"); }); shortcut.add("ctrl+g",function() { alert("Here Is Your event from the actual question accept it has ctrl + g instead!! This Is where you replace the command here with your command!"); shortcut.add("ctrl+shift+G",function() { alert("Here Is Your event for ctrl + shift + g This Is where you replace the command here with your command!"); }); shortcut.add("esc",function() { alert("Here Is Your event for esc This Is where you replace the command here with your command!"); }); //Some MAC Commands shortcut.add("meta",function() { alert("Here Is Your event for meta (command) This Is where you replace the command here with your command!"); }); shortcut.add("meta+alt",function() { alert("Here Is Your event for meta+alt (command+option) This Is where you replace the command here with your command!"); }); </script> shortcut.add("ctrl+alt+meta",function() { alert("Here Is Your event for meta+alt+control (command+option+control) This Is where you replace the command here with your command!"); }); //& =shift +7 shortcut.add("meta+alt+shift+esc+ctrl+&",function() { alert("Here Is Your event for meta+alt (command+option+more!) This Is where you replace the command here with your command!"); }); shortcut.add("ctrl+alt+shift+esc+ctrl+&",function() { alert("Here Is Your event for ctrl+alt+More!!! This Is where you replace the command here with your command!"); }); //Even try the F keys so on laptop it would be Fn plus the F key so in my case F5! shortcut.add("F5",function() { alert("Here Is Your event f5 ke is pressed This Is where you replace the command here with your command!"); }); //Extra...My Favourite one: CTRL+F <script> //Windows shortcut.add("Ctrl+F",function() { //change to meta+F for mac! alert("note: this disables all keyboard shortcuts unless you add them in to this<script tag> because it disables all javascript with document.write!"); document.writeln(" <link href=\"https://docs.google.com/static/document/client/css/3164405079-KixCss_ltr.css\" type=\"text/css\" rel=\"stylesheet\"> "); document.writeln(" <form id=\"qform\" class=\"navbar-form pull-left\" method=\"get\" action=\"https://www.google.com/search\" role=\"search\"> "); document.writeln(" "); document.writeln(" "); document.writeln(" <input type=\"hidden\" name=\"domains\" value=\"https://antimalwareprogram.co\" checked=\"checked\"> "); document.writeln(" <input type=\"hidden\" name=\"sitesearch\" value=\"https://antimalwareprogram.co\" checked=\"checked\"> "); document.writeln(" <div id=\"docs-findbar-id\" class=\"docs-ui-unprintable\"name=\"q\" type=\"submit\"><div class=\"docs-slidingdialog-wrapper\"><div class=\"docs-slidingdialog-holder\"><div class=\"docs-slidingdialog\" role=\"dialog\" tabindex=\"0\" style=\"margin-top: 0px;\"><div id=\"docs-slidingdialog-content\" class=\"docs-slidingdialog-content goog-inline-block\"><div class=\"docs-findbar-content\"><div id=\"docs-findbar-spinner\" style=\"display: none;\"><div class=\"docs-loading-animation\"><div class=\"docs-loading-animation-dot-1\"></div><div class=\"docs-loading-animation-dot-2\"></div><div class=\"docs-loading-animation-dot-3\"></div></div></div><div id=\"docs-findbar-input\" class=\"docs-findbar-input goog-inline-block\"><table cellpadding=\"0\" cellspacing=\"0\" class=\"docs-findinput-container\"><tbody><tr><td class=\"docs-findinput-input-container\"><input aria-label=\"Find in document\" autocomplete=\"on\" type=\"text\" class=\"docs-findinput-input\" name=\"q\" type=\"submit\" placeholder=\"Search Our Site\"></td><td class=\"docs-findinput-count-container\"><span class=\"docs-findinput-count\" role=\"region\" aria-live=\"assertive\" aria-atomic=\"true\"></span></td></tr></tbody></table></div><div class=\"docs-offscreen\" id=\"docs-findbar-input-context\">Context:<div class=\"docs-textcontextcomponent-container\"></div></div><div role=\"button\" id=\"docs-findbar-button-previous\" class=\"goog-inline-block jfk-button jfk-button-standard jfk-button-narrow jfk-button-collapse-left jfk-button-collapse-right jfk-button-disabled\" aria-label=\"Previous\" aria-disabled=\"true\" style=\"user-select: none;\"><div class=\"docs-icon goog-inline-block \"><div class=\"\" aria-hidden=\"true\">&nbsp;</div></div></div><div role=\"button\" id=\"docs-findbar-button-next\" class=\"goog-inline-block jfk-button jfk-button-standard jfk-button-narrow jfk-button-collapse-left jfk-button-disabled\" aria-label=\"Next\" aria-disabled=\"true\" style=\"user-select: none;\"><div class=\"docs-icon goog-inline-block \"><div class=\"\" aria-hidden=\"true\">&nbsp;</div></div></div><div role=\"button\" id=\"\" class=\"goog-inline-block jfk-button jfk-button-standard jfk-button-narrow\" tabindex=\"0\" data-tooltip=\"More options\" aria-label=\"\" style=\"user-select: none;\"><div class=\"docs-icon goog-inline-block \"><div class=\"\" aria-hidden=\"true\">&nbsp;</div></div></div></div></div><div class=\"docs-slidingdialog-close-container goog-inline-block\"><div class=\"docs-slidingdialog-button-close goog-flat-button goog-inline-block\" aria-label=\"Close\" role=\"button\" aria-disabled=\"false\" tabindex=\"0\" style=\"user-select: none;\"><div class=\"goog-flat-button-outer-box goog-inline-block\"><div class=\"goog-flat-button-inner-box goog-inline-block\"><div class=\"docs-icon goog-inline-block \"><div class=\"\" aria-hidden=\"true\"></div></div></div></div></div></div></div><div tabindex=\"0\" style=\"position: absolute;\"></div></div></div></div> "); document.writeln(" <a href=\"#\" onClick=\"window.location.reload();return false;\"></a> "); document.writeln(" "); document.writeln(" </form> "); document.writeln(" "); document.writeln(" <h1> Press esc key to cancel searching!</h1> "); document.addEventListener('contextmenu', event => event.preventDefault()); shortcut.add("esc",function() { alert("Press ctrl+shift instead!"); location.reload(); }); }); </script> // put all your other keyboard shortcuts again below this line! //Another Good one ...Ctrl+U Redirect to alternative view source! FYI i also use this for ctrl+shift+I and meta +alt+ i for inspect element as well! shortcut.add("meta+U",function() { window.open('view-source:https://antimalwareprogram.co/pages.php', '_blank').document.location = "antimalwareprogram.co-pages_php.source-javascript_page.html"; }); shortcut.add("ctrl+U",function() { window.open('view-source:https://antimalwareprogram.co/pages.php', '_blank').document.location = "antimalwareprogram.co-pages_php.source-javascript_page.html"; }); </script> 

Answer 13

您可以使用jQuery检查我自己的小型库文件。 在这里你有一个链接https://github.com/adrianmalik/jquery-hotkeys 。 主要思想主要是为$（document）对象添加“keydown”或“keyup”事件的事件。