如何在jQuery中捕获COMMAND + S？ [英] How can I capture COMMAND+S in jQuery?
本文介绍了如何在jQuery中捕获COMMAND + S？的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我正在开发一个Web应用程序，我正在尝试使用CTRL + S和COMMAND + S作为保存的快捷键。我看过 http://www.openjs.com/scripts/events/keyboard_shortcuts/ 并且它没有正确捕获meta键。
I have a web app I'm developing and I'm trying to have CTRL+S and COMMAND+S be the shortcut keys to save. I've looked at http://www.openjs.com/scripts/events/keyboard_shortcuts/ and it doesn't properly capture the "meta" key.
任何建议？
推荐答案
最新编辑：请在关注此回复之前请注意，这是一个非常古老的回复（2011年）并且尚未更新。显然现在有更好的回复（例如 lapin ）但这并不意味着我的无效。
Latest Please, before downvoting this response take in mind that this is a very old response (2011) and has not been updated. Obviously there are better responses now (like the one by lapin) but that doesn't mean that mine is invalid.
您可以使用 jquery热键。
编辑： github上有一个更新的版本你可以使用'meta'修饰符来获取命令+：
There's a newer version on github and you can use the 'meta' modifier to grab command+:
$(document).bind('keydown', 'meta+s', myaction.save);
Edit2：您还可以使用捕鼠器库/供应商，这是免费的。
You can also use the Mousetrap library/vendor, which is jQuery-free.
下载最新版本并根据此附件中的更改进行修改： http://code.google.com/p/js-hotkeys/issues/detail?id=26
Download the latest version and modify it following the changes in this attachment: http://code.google.com/p/js-hotkeys/issues/detail?id=26
您只需要添加三行：
在188行aprox。 （在 ctrl = event.ctrlKey，下）添加：
At line 188 aprox. (under ctrl = event.ctrlKey,) add this:
cmd = event.metaKey && !ctrl,
然后，在203行aprox处添加if。 （ if（！shift&&！ctrl&&！alt）{）：
Then, add a negation to the if at line 203 aprox. ( if(!shift && !ctrl && !alt){ ):
if(!shift && !ctrl && !alt && !cmd){
最后，在下如果（shift）modif + ='shift +'; 添加：
if(cmd) modif += 'command+';
现在当你创建一个绑定到命令+任何它会抓住它：
Now when you create a binding to command+whatever it will grab it:
$(document).bind('keydown', 'command+s', myaction.save);
在这里你可以获取最新修改的当前版本（0.7.9）：
Here you can grab the latest current version (0.7.9) modified:
/*
(c) Copyrights 2007 - 2008
Original idea by by Binny V A, http://www.openjs.com/scripts/events/keyboard_shortcuts/
jQuery Plugin by Tzury Bar Yochay
tzury.by@gmail.com
http://evalinux.wordpress.com
http://facebook.com/profile.php?id=513676303
Project's sites:
http://code.google.com/p/js-hotkeys/
http://github.com/tzuryby/hotkeys/tree/master
License: same as jQuery license.
USAGE:
// simple usage
$(document).bind('keydown', 'Ctrl+c', function(){ alert('copy anyone?');});
// special options such as disableInIput
$(document).bind('keydown', {combi:'Ctrl+x', disableInInput: true} , function() {});
Note:
This plugin wraps the following jQuery methods: $.fn.find, $.fn.bind and $.fn.unbind
*/
(function (jQuery){
// keep reference to the original $.fn.bind, $.fn.unbind and $.fn.find
jQuery.fn.__bind__ = jQuery.fn.bind;
jQuery.fn.__unbind__ = jQuery.fn.unbind;
jQuery.fn.__find__ = jQuery.fn.find;
var hotkeys = {
version: '0.7.9',
override: /keypress|keydown|keyup/g,
triggersMap: {},
specialKeys: { 27: 'esc', 9: 'tab', 32:'space', 13: 'return', 8:'backspace', 145: 'scroll',
20: 'capslock', 144: 'numlock', 19:'pause', 45:'insert', 36:'home', 46:'del',
35:'end', 33: 'pageup', 34:'pagedown', 37:'left', 38:'up', 39:'right',40:'down',
109: '-',
112:'f1',113:'f2', 114:'f3', 115:'f4', 116:'f5', 117:'f6', 118:'f7', 119:'f8',
120:'f9', 121:'f10', 122:'f11', 123:'f12', 191: '/'},
shiftNums: { "`":"~", "1":"!", "2":"@", "3":"#", "4":"$", "5":"%", "6":"^", "7":"&",
"8":"*", "9":"(", "0":")", "-":"_", "=":"+", ";":":", "'":"\"", ",":"<",
".":">", "/":"?", "\\":"|" },
newTrigger: function (type, combi, callback) {
// i.e. {'keyup': {'ctrl': {cb: callback, disableInInput: false}}}
var result = {};
result[type] = {};
result[type][combi] = {cb: callback, disableInInput: false};
return result;
}
};
// add firefox num pad char codes
//if (jQuery.browser.mozilla){
// add num pad char codes
hotkeys.specialKeys = jQuery.extend(hotkeys.specialKeys, { 96: '0', 97:'1', 98: '2', 99:
'3', 100: '4', 101: '5', 102: '6', 103: '7', 104: '8', 105: '9', 106: '*',
107: '+', 109: '-', 110: '.', 111 : '/'
});
//}
// a wrapper around of $.fn.find
// see more at: http://groups.google.com/group/jquery-en/browse_thread/thread/18f9825e8d22f18d
jQuery.fn.find = function( selector ) {
this.query = selector;
return jQuery.fn.__find__.apply(this, arguments);
};
jQuery.fn.unbind = function (type, combi, fn){
if (jQuery.isFunction(combi)){
fn = combi;
combi = null;
}
if (combi && typeof combi === 'string'){
var selectorId = ((this.prevObject && this.prevObject.query) || (this[0].id && this[0].id) || this[0]).toString();
var hkTypes = type.split(' ');
for (var x=0; x<hkTypes.length; x++){
delete hotkeys.triggersMap[selectorId][hkTypes[x]][combi];
}
}
// call jQuery original unbind
return this.__unbind__(type, fn);
};
jQuery.fn.bind = function(type, data, fn){
// grab keyup,keydown,keypress
var handle = type.match(hotkeys.override);
if (jQuery.isFunction(data) || !handle){
// call jQuery.bind only
return this.__bind__(type, data, fn);
}
else{
// split the job
var result = null,
// pass the rest to the original $.fn.bind
pass2jq = jQuery.trim(type.replace(hotkeys.override, ''));
// see if there are other types, pass them to the original $.fn.bind
if (pass2jq){
result = this.__bind__(pass2jq, data, fn);
}
if (typeof data === "string"){
data = {'combi': data};
}
if(data.combi){
for (var x=0; x < handle.length; x++){
var eventType = handle[x];
var combi = data.combi.toLowerCase(),
trigger = hotkeys.newTrigger(eventType, combi, fn),
selectorId = ((this.prevObject && this.prevObject.query) || (this[0].id && this[0].id) || this[0]).toString();
//trigger[eventType][combi].propagate = data.propagate;
trigger[eventType][combi].disableInInput = data.disableInInput;
// first time selector is bounded
if (!hotkeys.triggersMap[selectorId]) {
hotkeys.triggersMap[selectorId] = trigger;
}
// first time selector is bounded with this type
else if (!hotkeys.triggersMap[selectorId][eventType]) {
hotkeys.triggersMap[selectorId][eventType] = trigger[eventType];
}
// make trigger point as array so more than one handler can be bound
var mapPoint = hotkeys.triggersMap[selectorId][eventType][combi];
if (!mapPoint){
hotkeys.triggersMap[selectorId][eventType][combi] = [trigger[eventType][combi]];
}
else if (mapPoint.constructor !== Array){
hotkeys.triggersMap[selectorId][eventType][combi] = [mapPoint];
}
else {
hotkeys.triggersMap[selectorId][eventType][combi][mapPoint.length] = trigger[eventType][combi];
}
// add attribute and call $.event.add per matched element
this.each(function(){
// jQuery wrapper for the current element
var jqElem = jQuery(this);
// element already associated with another collection
if (jqElem.attr('hkId') && jqElem.attr('hkId') !== selectorId){
selectorId = jqElem.attr('hkId') + ";" + selectorId;
}
jqElem.attr('hkId', selectorId);
});
result = this.__bind__(handle.join(' '), data, hotkeys.handler)
}
}
return result;
}
};
// work-around for opera and safari where (sometimes) the target is the element which was last
// clicked with the mouse and not the document event it would make sense to get the document
hotkeys.findElement = function (elem){
if (!jQuery(elem).attr('hkId')){
if (jQuery.browser.opera || jQuery.browser.safari){
while (!jQuery(elem).attr('hkId') && elem.parentNode){
elem = elem.parentNode;
}
}
}
return elem;
};
// the event handler
hotkeys.handler = function(event) {
var target = hotkeys.findElement(event.currentTarget),
jTarget = jQuery(target),
ids = jTarget.attr('hkId');
if(ids){
ids = ids.split(';');
var code = event.which,
type = event.type,
special = hotkeys.specialKeys[code],
// prevent f5 overlapping with 't' (or f4 with 's', etc.)
character = !special && String.fromCharCode(code).toLowerCase(),
shift = event.shiftKey,
ctrl = event.ctrlKey,
// patch for jquery 1.2.5 && 1.2.6 see more at:
// http://groups.google.com/group/jquery-en/browse_thread/thread/83e10b3bb1f1c32b
cmd = event.metaKey && !ctrl,
alt = event.altKey || event.originalEvent.altKey,
mapPoint = null;
for (var x=0; x < ids.length; x++){
if (hotkeys.triggersMap[ids[x]][type]){
mapPoint = hotkeys.triggersMap[ids[x]][type];
break;
}
}
//find by: id.type.combi.options
if (mapPoint){
var trigger;
// event type is associated with the hkId
if(!shift && !ctrl && !alt && !cmd) { // No Modifiers
trigger = mapPoint[special] || (character && mapPoint[character]);
}
else{
// check combinations (alt|ctrl|shift+anything)
var modif = '';
if(alt) modif +='alt+';
if(ctrl) modif+= 'ctrl+';
if(shift) modif += 'shift+';
if(cmd) modif += 'command+';
// modifiers + special keys or modifiers + character or modifiers + shift character or just shift character
trigger = mapPoint[modif+special];
if (!trigger){
if (character){
trigger = mapPoint[modif+character]
|| mapPoint[modif+hotkeys.shiftNums[character]]
// '$' can be triggered as 'Shift+4' or 'Shift+$' or just '$'
|| (modif === 'shift+' && mapPoint[hotkeys.shiftNums[character]]);
}
}
}
if (trigger){
var result = false;
for (var x=0; x < trigger.length; x++){
if(trigger[x].disableInInput){
// double check event.currentTarget and event.target
var elem = jQuery(event.target);
if (jTarget.is("input") || jTarget.is("textarea") || jTarget.is("select")
|| elem.is("input") || elem.is("textarea") || elem.is("select")) {
return true;
}
}
// call the registered callback function
result = result || trigger[x].cb.apply(this, [event]);
}
return result;
}
}
}
};
// place it under window so it can be extended and overridden by others
window.hotkeys = hotkeys;
return jQuery;
})(jQuery);
这篇关于如何在jQuery中捕获COMMAND + S？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
