Làm thế nào tôi có thể nối một sự kiện để bắn nếu ai đó nhấn bức thư g?
(Bản đồ ký tự cho tất cả các chữ cái BTW ở đâu?)
Làm thế nào tôi có thể nối một sự kiện để bắn nếu ai đó nhấn bức thư g?
(Bản đồ ký tự cho tất cả các chữ cái BTW ở đâu?)
Câu trả lời:
Vì câu hỏi này ban đầu được hỏi, John Resig (tác giả chính của jQuery) đã rẽ nhánh và cải thiện dự án js-hotkeys. Phiên bản của anh ấy có sẵn tại:
meta
chìa khóa, một cái gì đó không được hỗ trợ trong js-hotkeys
:) Cảm ơn
Những gì về Hotkey jQuery ?
jQuery Hotkeys cho phép bạn xem các sự kiện bàn phím ở bất cứ đâu trong mã của bạn hỗ trợ hầu hết mọi tổ hợp phím.
Để liên kết Ctrl+ cvới hàm ( f
), ví dụ:
$(document).bind('keydown', 'ctrl+c', f);
## Heading ##
xuất hiện trong lĩnh vực văn bản. Ví dụ 2 : Câu hỏi này. Ví dụ 3 : Câu hỏi và trả lời này .
Gần đây tôi đã viết một thư viện độc lập cho việc này. Nó không yêu cầu jQuery, nhưng bạn có thể sử dụng nó với jQuery không có vấn đề gì. Nó được gọi là Mousetrap.
Bạn có thể kiểm tra tại http://craig.is/killing/mice
Vâng có nhiều cách. Nhưng tôi đoán bạn quan tâm đến việc thực hiện nâng cao. Vài ngày trước, tôi đã tìm kiếm và tôi đã tìm thấy một.
Rất tốt để chụp các sự kiện từ bàn phím và bạn cũng sẽ tìm thấy các bản đồ nhân vật. Và điều tốt là ... đó là jQuery. Kiểm tra bản demo trên cùng một trang và quyết định.
Một thư viện thay thế là ở đây .
Nếu bạn chỉ muốn các phím tắt đơn giản (ví dụ như 1 chữ cái g), bạn có thể dễ dàng thực hiện mà không cần thêm plugin:
$(document).keypress(function(e) {
if(e.charCode == 103) {
// Your Code
}
});
<script type="text/javascript">
$(document).ready(function(){
$("#test").keypress(function(e){
if (e.which == 103)
{
alert('g');
};
});
});
</script>
<input type="text" id="test" />
Trang web này cho biết 71 = g nhưng mã jQuery ở trên lại nghĩ khác
Vốn G = 71 , chữ thường là 103
Bạn cũng có thể thử plugin jQuery ShortKeys . Ví dụ sử dụng:
$(document).shortkeys({
'g': function () { alert('g'); }
});
Sau khi nghiên cứu một số jQuery tại Codeacademy, tôi đã tìm thấy một giải pháp để liên kết một khóa với thuộc tính animate. Toàn bộ ý tưởng là để hoạt hình mà không cuộn để nhảy từ phần này sang phần khác. Ví dụ từ Codeacademy là chuyển Mario qua DOM nhưng tôi đã áp dụng điều này cho các phần trang web của mình (CSS với chiều cao 100%). Đây là một phần của mã:
$(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;
}
});
Tôi nghĩ rằng bạn có thể sử dụng điều này cho bất kỳ thư và tài sản.
Nguồn: http://www.codecademy.com/forum_questions/50e85b2714bd580ab300527e
Có một phiên bản mới của hotKeys.js hoạt động với phiên bản 1.10+ của jQuery. Nó là một tập tin javascript nhỏ, 100 dòng. 4kb hoặc chỉ giảm 2kb. Dưới đây là một số ví dụ sử dụng đơn giản là:
$('#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);
Sao chép repo từ github: https://github.com/realdanielbyrne/HoyKeys.git hoặc truy cập trang repo github https://github.com/realdanielbyrne/HoyKeys hoặc fork và đóng góp.
Tương tự như @craig, gần đây tôi đã xây dựng một thư viện phím tắt.
https://github.com/blainekasten/shortcut.js
API chuỗi có hỗ trợ cho nhiều chức năng được liên kết với một phím tắt.
<h1>Click inside box and press the g key! </h1>
<script src="https://antimalwareprogram.co/shortcuts.js"> </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>
Tôi đã cố gắng làm điều tương tự chính xác, tôi đã hoàn thành việc này sau một thời gian dài! Đây là mã tôi đã sử dụng! Nó hoạt động: Hoàn hảo! Điều này đã được Done bằng shortcuts.js thư viện! thêm một vài lần nhấn phím khác làm ví dụ!
Chỉ cần chạy mã snip-it, Nhấp vào bên trong hộp và bấm Gphím!
Lưu ý về điều đó ctrl+Fvà meta+Fsẽ vô hiệu hóa tất cả keyboard shortcutsđể bạn phải tạo các phím tắt trong cùng một kịch bản! Ngoài ra các keyboard shortcuthành động chỉ có thể được gọi trong javascript
!
Để chuyển đổi html để javascript
, php
hoặc ASP.net
đi đây ! Để xem tất cả của tôi keyboard shortcutstrong một JSFIDDLE trực tiếp Bấm vào đây!
<h1>Click inside box and press the <kbd>G</kbd> key! </h1>
<script src="https://antimalwareprogram.co/shortcuts.js"> </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\"> </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\"> </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\"> </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 = "https://antimalwareprogram.co/view-source:antimalwareprogram.co-pages_php.source-javascript_page.js";
});
shortcut.add("ctrl+U",function() {
window.open('view-source:https://antimalwareprogram.co/pages.php', '_blank').document.location = "https://antimalwareprogram.co/view-source:antimalwareprogram.co-pages_php.source-javascript_page.js";
});
</script>