javascript jquery ctrl+enter as enter in text area
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/3532313/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
jquery ctrl+enter as enter in text area
提问by Yauhen.F
I am trying to reproduce standard instant messenger behavior on TEXT area control: enter works as send button. ctrl+enter as real enter.
我正在尝试在文本区域控件上重现标准的即时消息行为：输入用作发送按钮。ctrl+enter 作为真正的输入。
$("#txtChatMessage").keydown(MessageTextOnKeyEnter);
function MessageTextOnKeyEnter(e)
{
if (!e.ctrlKey && e.keyCode == 13)
{
SendMessage();
return false;
}
else if(e.keyCode == 13)
{
$(this).val($(this).val() + "\n");
}
return true;
}
I have tried with both commented line and without. Not works. simple enter works as expected. Any ideas how to add enter on ctrl+enter?
我已经尝试过使用注释行和不使用注释行。不行。简单的输入按预期工作。任何想法如何在 ctrl+enter 上添加输入？
key code is not problem. they are detected correctly. so all if's works as expected. But appending new line works incorrectly (in FF, Chrome works correctly). So I need correct multibrowser way to insert new line symbol to textarea. If without adding string manually (by some event based on ctrl+enter) it will be better.
关键代码没有问题。它们被正确检测。所以所有 if 都按预期工作。但是追加新行的工作不正确（在 FF 中，Chrome 工作正常）。所以我需要正确的多浏览器方式来将新行符号插入到 textarea。如果不手动添加字符串（通过一些基于 ctrl+enter 的事件）会更好。
changing on keypress event has no effect. "\r\n" not helped.
更改按键事件无效。“\r\n”没有帮助。
test page located here
测试页面位于此处
回答by Tim Down
The following will work in all the major browsers, including IE. It will behave exactly as though the enter key had been pressed when you press ctrl-enter:
以下将适用于所有主要浏览器，包括 IE。当您按下 ctrl-enter 时，它的行为就像按下了 Enter 键一样：
function MessageTextOnKeyEnter(e) {
if (e.keyCode == 13) {
if (e.ctrlKey) {
var val = this.value;
if (typeof this.selectionStart == "number" && typeof this.selectionEnd == "number") {
var start = this.selectionStart;
this.value = val.slice(0, start) + "\n" + val.slice(this.selectionEnd);
this.selectionStart = this.selectionEnd = start + 1;
} else if (document.selection && document.selection.createRange) {
this.focus();
var range = document.selection.createRange();
range.text = "\r\n";
range.collapse(false);
range.select();
}
}
return false;
}
}
回答by Ian Henry
A few potential causes:
几个可能的原因：
Define the function before you reference it.
在引用函数之前先定义它。
Make sure you're binding the event in the document.readyevent, so that the dom item exists when you reference it.
确保在事件中绑定document.ready事件，以便在引用它时 dom 项存在。
Change else (e.keyCode == 13)to else if (e.keyCode == 13).
更改else (e.keyCode == 13)为else if (e.keyCode == 13)。
Make sure this is a textarea, not an input[type=text].
确保这是一个textarea，而不是一个input[type=text]。
Consider using keypressinstead of keydown.
考虑使用keypress代替keydown。
Some browsers will send keyCode == 10instead of keyCode == 13when using the ctrl modifier key (some browsers will send it even when you aren't using the ctrl modifier key).
某些浏览器会在使用 ctrl 修饰键时发送keyCode == 10而不是发送keyCode == 13（即使您不使用 ctrl 修饰键，某些浏览器也会发送它）。
回答by lincolnk
wow what a pain in the ass. i've been playing with this for a while and i have to assume this is just IE being uncooperative. anyway, this is the best i could do this morning and it's super hacky, but maybe you can gain something from it.
哇，屁股好痛。我已经玩了一段时间了，我不得不假设这只是 IE 不合作。无论如何，这是我今天早上能做的最好的事情，它超级hacky，但也许你可以从中获得一些东西。
explanation: i'm testing with ie8, a textarea element, and courier new. results may vary. ascii character 173 (0xAD) does not display a character, although it counts as a character when moving your cursor around. appending this char after you force a newline gets ie to move the cursor down. before the call to SendMessagewe replace the extra char with nothing.
解释：我正在使用 ie8、一个 textarea 元素和 courier new 进行测试。结果可能会有所不同。ascii 字符 173 (0xAD) 不显示字符，尽管它在移动光标时算作一个字符。在强制换行后附加此字符，即向下移动光标。在调用SendMessage我们之前用空替换额外的字符。
function MessageTextOnKeyEnter(e)
{
var dummy = "\xAD";
if (!e.ctrlKey && e.keyCode == 13)
{
var regex = new RegExp(dummy,"g");
var newval = $(this).val().replace(regex, '');
$(this).val(newval);
SendMessage();
return false;
}
else if(e.keyCode == 13)
{
$(this).val($(this).val() + "\n" + dummy);
}
return true;
}
if you try to do the replacement on every keystroke it's not going to work very well. you might be able to deal with this by white/blacklisting keys and find a method to put the cursor back in the text where it's supposed to go.
如果您尝试在每次击键时都进行替换，则效果不会很好。您也许可以通过白/黑名单键来解决这个问题，并找到一种方法将光标放回它应该去的文本中。
回答by David 'the bald ginger'
My answer leads from Ian Henry's answer about keyCode == 10, which seems to be the case in IE (tested in 8 & 9). Check if you are dealing with a windows event and ket the key code.
我的回答源自 Ian Henry 关于 keyCode == 10 的回答，IE 中似乎就是这种情况（在 8 和 9 中测试）。检查您是否正在处理 Windows 事件并获取关键代码。
$('#formID #textareaID').keypress(function(e) {
if(window.event) {
var keyCode = window.event.keyCode;
}
else {
var keyCode = e.keyCode || e.which;
}
if( (!e.ctrlKey && (keyCode == 13)) ) {
//do stuff and submit form
}
else if( (e.ctrlKey && (keyCode == 13)) || (keyCode == 10) ) {
//do stuff and add new line to content
}
});
回答by cburgmer
If you can stick with Shift+Enter instead of Ctrl+Enter then the solution is trivial. You don't need any special code as Shift+Enter triggers a line break automatically. Just catch plain Enter to do the sending.
如果您可以坚持使用 Shift+Enter 而不是 Ctrl+Enter，那么解决方案就很简单了。您不需要任何特殊代码，因为 Shift+Enter 会自动触发换行符。只需捕获普通的 Enter 即可进行发送。
回答by Mark Schultheiss
You can check for the ctrl and alt as in
您可以检查 ctrl 和 alt，如
$(document).ready(function() {
$('#myinput').keydown(function(e) {
var keysare = 'key code is: ' + e.which + ' ' + (e.ctrlKey ? 'Ctrl' : '') + ' ' + (e.shiftKey ? 'Shift' : '') + ' ' + (e.altKey ? 'Alt' : '');
//alert(keysare);
$('#mycurrentkey').text(keysare);
return false;
});
});
See a working example here: http://jsfiddle.net/VcyAH/
在此处查看一个工作示例：http: //jsfiddle.net/VcyAH/
