jQuery事件Keypress:按下了哪个键？
Bla*_*laM 703 javascript jquery events bind keypress
使用jQuery,当我绑定到按键事件时,如何找出按下了哪个键？
$('#searchbox input').bind('keypress', function(e) {});
我想在ENTER按下时触发提交.
[更新]
即使我发现(或者更好:一个)自己回答,似乎还有一些变异的空间;)
有没有之间的差异keyCode和which-尤其是如果我只是在寻找ENTER,这永远不会是一个unicode关键？
有些浏览器提供一个属性而其他浏览器提供另一个属性吗？
Era*_*rin 835
实际上这更好:
var code = e.keyCode || e.which;
if(code == 13) { //Enter keycode
//Do something
}
- 为什么巨大的upvote计数？问题是关于jQuery,它会对这些东西进行规范化,因此除了`e.which`**之外,没有必要使用任何其他东西,无论你使用哪个事件. (197认同)
- if((e.keyCode || e.which)== 13)？;) (84认同)
- 根据本页后面的评论,jQuery会进行规范化,以便每次都在事件对象上定义"which".因此,检查'keyCode'应该是不必要的. (49认同)
- @Tim:唉,我刚刚使用http://api.jquery.com/keypress对Firefox进行了测试:当我按下<Tab>时,`e.which`没有设置(保持为'0`),但是`e .keyCode`是(`9`).请参阅http://stackoverflow.com/questions/4793233/capturing-the-tab-key-using-javascript-in-firefox为何这很重要. (48认同)
- @Marcel:是的,jQuery的密钥处理有缺点,这是一个不幸的例子,但对于Enter键,这个问题就是这个问题,情况非常简单. (3认同)
Vla*_*kov 131
试试这个
$('#searchbox input').bind('keypress', function(e) {
if(e.keyCode==13){
// Enter pressed... do anything here...
}
});
- @VladimirPrudnikov哦,哦,啊!啊!在那个链接上有mac的eveywhere - 人性! (5认同)
- @VladimirPrudnikov一个linux版本怎么样？ (2认同)
小智 61
如果您使用的是jQuery UI,则可以使用常用密钥代码的翻译.在ui/ui/ui.core.js中:
$.ui.keyCode = {
...
ENTER: 13,
...
};
在tests/simulate/jquery.simulate.js中也有一些翻译,但我在核心JS库中找不到任何翻译.请注意,我只是贪图消息来源.也许还有其他方法可以摆脱这些神奇的数字.
您还可以使用String.charCodeAt和.fromCharCode:
>>> String.charCodeAt('\r') == 13
true
>>> String.fromCharCode(13) == '\r'
true
- 更正它是**.ui.keyCode.ENTER**而不是*$ .keyCode.ENTER* - 虽然通过thx提示,但确实像魅力一样! (13认同)
Fra*_*man 39
鉴于您使用的是jQuery,您应该绝对使用.which.是的,不同的浏览器设置不同的属性,但jQuery会规范化它们并在每种情况下设置.which值.请参阅http://api.jquery.com/keydown/上的文档说明:
要确定按下了哪个键,我们可以检查传递给处理函数的事件对象.虽然浏览器使用不同的属性来存储此信息,但jQuery会规范化.which属性,以便我们可以可靠地使用它来检索密钥代码.
- 你有一个演示这个bug的repro吗？最好向jQuery的所有者报告,而不是尝试重新实现他们的工作. (4认同)
- 从我所看到的使用event.which并尝试与$ .ui.keyCode进行比较导致不确定的行为.特别是小写[L]键映射到$ .ui.keyCode.NUMPAD_ENTER.可爱. (2认同)
小智 31
...这个例子阻止了表单提交(定期捕获按键#13时的基本意图):
$('input#search').keypress(function(e) {
if (e.which == '13') {
e.preventDefault();
doSomethingWith(this.value);
}
});
Luc*_*ofi 27
// in jquery source code...
if (!event.which && ((event.charCode || event.charCode === 0) ? event.charCode : event.keyCode)) {
event.which = event.charCode || event.keyCode;
}
// So you have just to use
$('#searchbox input').bind('keypress', function(e) {
if (e.which === 13) {
alert('ENTER WAS PRESSED');
}
});
- 这是来自jQuery源代码的直接粘贴,是jQuery用于规范化.which事件属性的代码. (19认同)
- 它确实有效; 我很确定,因为jQuery正好使用那个代码:)如果你已经有jQuery可用,那么只需使用它 - 你不需要在自己的代码中使用它. (13认同)
Kev*_*vin 25
编辑:这仅适用于IE ...
我意识到这是一个旧帖子,但有人可能会觉得这很有用.
键事件是映射的,因此您可以使用键值来代替使用键码值,使其更具可读性.
$(document).ready( function() {
$('#searchbox input').keydown(function(e)
{
setTimeout(function ()
{
//rather than using keyup, you can use keydown to capture
//the input as it's being typed.
//You may need to use a timeout in order to allow the input to be updated
}, 5);
});
if(e.key == "Enter")
{
//Enter key was pressed, do stuff
}else if(e.key == "Spacebar")
{
//Spacebar was pressed, do stuff
}
});
这是一个带有映射键的备忘单,我从这个博客得到了
- 没有'e.key`属性. (5认同)
- 嗯,看起来它是IE特有的属性.它适用于我在IE中的应用程序但不适用于Chrome.猜猜我正在使用密码. (3认同)
- +1 fr优秀表,其中包含最重要的键 (3认同)
小智 21
查看支持组合键的优秀jquery.hotkeys插件:
$(document).bind('keydown', 'ctrl+c', fn);
小智 14
$(document).ready(function(){
$("#btnSubmit").bind("click",function(){$('#'+'<%=btnUpload.ClientID %>').trigger("click");return false;});
$("body, input, textarea").keypress(function(e){
if(e.which==13) $("#btnSubmit").click();
});
});
希望这可以帮到你!!!
Iva*_*van 11
这几乎是keyCodes的完整列表:
3: "break",
8: "backspace / delete",
9: "tab",
12: 'clear',
13: "enter",
16: "shift",
17: "ctrl",
18: "alt",
19: "pause/break",
20: "caps lock",
27: "escape",
28: "conversion",
29: "non-conversion",
32: "spacebar",
33: "page up",
34: "page down",
35: "end",
36: "home ",
37: "left arrow ",
38: "up arrow ",
39: "right arrow",
40: "down arrow ",
41: "select",
42: "print",
43: "execute",
44: "Print Screen",
45: "insert ",
46: "delete",
48: "0",
49: "1",
50: "2",
51: "3",
52: "4",
53: "5",
54: "6",
55: "7",
56: "8",
57: "9",
58: ":",
59: "semicolon (firefox), equals",
60: "<",
61: "equals (firefox)",
63: "ß",
64: "@ (firefox)",
65: "a",
66: "b",
67: "c",
68: "d",
69: "e",
70: "f",
71: "g",
72: "h",
73: "i",
74: "j",
75: "k",
76: "l",
77: "m",
78: "n",
79: "o",
80: "p",
81: "q",
82: "r",
83: "s",
84: "t",
85: "u",
86: "v",
87: "w",
88: "x",
89: "y",
90: "z",
91: "Windows Key / Left ? / Chromebook Search key",
92: "right window key ",
93: "Windows Menu / Right ?",
96: "numpad 0 ",
97: "numpad 1 ",
98: "numpad 2 ",
99: "numpad 3 ",
100: "numpad 4 ",
101: "numpad 5 ",
102: "numpad 6 ",
103: "numpad 7 ",
104: "numpad 8 ",
105: "numpad 9 ",
106: "multiply ",
107: "add",
108: "numpad period (firefox)",
109: "subtract ",
110: "decimal point",
111: "divide ",
112: "f1 ",
113: "f2 ",
114: "f3 ",
115: "f4 ",
116: "f5 ",
117: "f6 ",
118: "f7 ",
119: "f8 ",
120: "f9 ",
121: "f10",
122: "f11",
123: "f12",
124: "f13",
125: "f14",
126: "f15",
127: "f16",
128: "f17",
129: "f18",
130: "f19",
131: "f20",
132: "f21",
133: "f22",
134: "f23",
135: "f24",
144: "num lock ",
145: "scroll lock",
160: "^",
161: '!',
163: "#",
164: '$',
165: 'ù',
166: "page backward",
167: "page forward",
169: "closing paren (AZERTY)",
170: '*',
171: "~ + * key",
173: "minus (firefox), mute/unmute",
174: "decrease volume level",
175: "increase volume level",
176: "next",
177: "previous",
178: "stop",
179: "play/pause",
180: "e-mail",
181: "mute/unmute (firefox)",
182: "decrease volume level (firefox)",
183: "increase volume level (firefox)",
186: "semi-colon / ñ",
187: "equal sign ",
188: "comma",
189: "dash ",
190: "period ",
191: "forward slash / ç",
192: "grave accent / ñ / æ",
193: "?, / or °",
194: "numpad period (chrome)",
219: "open bracket ",
220: "back slash ",
221: "close bracket / å",
222: "single quote / ø",
223: "`",
224: "left or right ? key (firefox)",
225: "altgr",
226: "< /git >",
230: "GNOME Compose Key",
231: "ç",
233: "XF86Forward",
234: "XF86Back",
240: "alphanumeric",
242: "hiragana/katakana",
243: "half-width/full-width",
244: "kanji",
255: "toggle touchpad"
- 我知道我需要再次投票. (3认同)
好吧,我是盲人:
e.which
将包含密钥的ASCII代码.
请参阅https://developer.mozilla.org/En/DOM/Event.which
我将用这一行补充解决方案代码e.preventDefault();.在表格的输入栏的情况下,不参加按下提交
var code = (e.keyCode ? e.keyCode : e.which);
if(code == 13) { //Enter keycode
e.preventDefault();
//Do something
}
使用event.key和现代JS！
没有数字代码了。您可以直接检查密钥。例如"Enter"，"LeftArrow"、"r"、 或"R"。
const input = document.getElementById("searchbox");
input.addEventListener("keypress", function onEvent(event) {
if (event.key === "Enter") {
// Submit
}
else if (event.key === "Q") {
// Play quacking duck sound, maybe...
}
});
| 归档时间： |
|
| 查看次数： |
760582 次 |
| 最近记录： |