【发布时间】:2010-12-13 15:23:27
【问题描述】:
当光标在 TEXTAREA 内并按下 Ctrl+Enter 时如何触发?使用 jQuery。谢谢
【问题讨论】:
-
您接受的答案不起作用。请更改您接受的答案
标签: javascript jquery html hotkeys
当光标在 TEXTAREA 内并按下 Ctrl+Enter 时如何触发?使用 jQuery。谢谢
【问题讨论】:
标签: javascript jquery html hotkeys
实际上,这个可以在所有浏览器中使用:
if ((event.keyCode == 10 || event.keyCode == 13) && event.ctrlKey)
链接到js fiddle。
注意事项:
keyCode 10,而不是 13 (bug report)。所以我们需要检查两者。ctrlKey 在 Windows、Linux 和 macOS 上是 control(不是 command)。另请参阅metaKey。【讨论】:
ctrlKey 是否对应 Mac 上的 Command 键?
if ((e.keyCode == 10 || e.keyCode == 13) && (e.ctrlKey || e.metaKey))
您可以使用event.ctrlKey 标志来查看是否按下了 Ctrl 键,如下所示:
$('#textareaId').keydown(function (e) {
if (e.ctrlKey && e.keyCode == 13) {
// Ctrl-Enter pressed
}
});
检查上面的sn-p here。
【讨论】:
10,而不是13。
keypress事件时,keycode为10,但keydown或keyup会报13。只测试chrome
通用解决方案
这也支持 macOS:Ctrl+Enter 和 ⌘ Command+Enter 都将被接受。
if ((e.ctrlKey || e.metaKey) && (e.keyCode == 13 || e.keyCode == 10)) {
// do something
}
【讨论】:
e.ctrlKey检测⌃ Control和e.metaKey检测⌘ Command。如果您希望 Ctrl-Enter 和 Command-Enter 都触发该行为,请使用此选项。
10 的e.keyCode 来表示除了13 之外的Enter? MDN keyCode documentation 仅列出 13 作为 Enter 的可能值,并在多个浏览器和操作系统中进行了测试。
我发现其他人的答案要么不完整,要么不兼容跨浏览器。
此代码适用于谷歌浏览器。
$(function ()
{
$(document).on("keydown", "#textareaId", function(e)
{
if ((e.keyCode == 10 || e.keyCode == 13) && e.ctrlKey)
{
alert('ctrl+enter');
}
});
});
【讨论】:
这可以扩展为一个简单但灵活的 JQuery 插件,如下所示:
$.fn.enterKey = function (fnc, mod) {
return this.each(function () {
$(this).keypress(function (ev) {
var keycode = (ev.keyCode ? ev.keyCode : ev.which);
if ((keycode == '13' || keycode == '10') && (!mod || ev[mod + 'Key'])) {
fnc.call(this, ev);
}
})
})
}
这样
$('textarea').enterKey(function() {$(this).closest('form').submit(); }, 'ctrl')
当用户按下 ctrl-enter 并关注表单的文本区域时应该提交表单。
【讨论】:
$('my_text_area').focus(function{ set_focus_flag });
//ctrl on key down set flag
//enter on key down = check focus flag, check ctrl flag
【讨论】:
首先你必须在按下 Ctrl 时设置一个标志,在 onkeydown 上执行此操作。然后你必须检查回车键。当您看到 Ctrl 的按键时取消设置标志。
【讨论】:
KeyboardEvent 已经包含指示在按住 Ctrl 时是否按下某个键的属性。无需手动检测Ctrl 键。
游戏可能有点晚了,但这是我使用的。它还将强制提交作为光标当前目标的表单。
$(document.body).keypress(function (e) {
var $el = $(e.target);
if (e.ctrlKey && e.keyCode == 10) {
$el.parents('form').submit();
} else if (e.ctrlKey && e.keyCode == 13) {
$el.parents('form').submit();
}
});
【讨论】:
if...else if”简化为单个if (e.ctrlKey && (e.keyCode == 10 || e.keyCode == 13))。