Ctrl + Enter jQuery en TEXTAREA

92

¿Cómo puedo activar algo cuando el cursor está dentro de TEXTAREA y se presiona Ctrl+ Enter? Usando jQuery . Gracias

HP.
fuente
la respuesta que aceptó no funciona. Cambie su respuesta aceptada
peterchaula

Respuestas:

128

Puede usar la event.ctrlKeybandera para ver si la Ctrltecla está presionada, algo como esto:

$('#textareaId').keydown(function (e) {

  if (e.ctrlKey && e.keyCode == 13) {
    // Ctrl-Enter pressed
  }
});

Consulte el fragmento anterior aquí .

Christian C. Salvadó
fuente
15
Esto no funciona en Google Chrome. Cuando se presiona Ctrl + Enter, el código de la tecla es 10, no 13.
Znarkus
39
Esto no funciona. La siguiente solución de Yarolslav Yakovlev funciona correctamente. Cambie la respuesta aceptada para ahorrar tiempo a las personas.
Phil Ricketts
1
@Replete ¿Qué entorno ha probado? ¿Existe alguna documentación sobre keyCode 10?
Sanghyun Lee
keyCode 10 ya no debería suceder en Chrome, consulte bugs.chromium.org/p/chromium/issues/detail?id=79407
swissspidy
cuando se active el keypressevento, el código clave será 10, pero keydowno keyupinformará 13. Solo prueba Chrome
iulo
137

En realidad, este hace el truco y funciona en todos los navegadores:

if ((event.keyCode == 10 || event.keyCode == 13) && event.ctrlKey)

enlace a js fiddle .

Notas:

  • En Chrome en Windows y Linux, enterse registraría como keyCode10, no 13 ( informe de error ). Así que tenemos que comprobar cualquiera de los dos.
  • ctrlKeyestá controlen Windows, Linux y macOS (no command). Vea también metaKey.
Yaroslav Yakovlev
fuente
El violín no funciona en Firefox 27, ¿qué pasa?
CodeManX
4
@Yaroslav: ¿Podría decirnos cuál es el uso de "event.keyCode == 10" en su respuesta?
Shashank.gupta40
3
Si alguien todavía se pregunta sobre keyCode 10 y otras cosas de Chrome, lea esto .
user2422869
1
@YaroslavYakovlev ¿ ctrlKeycorresponde a la tecla Comando en Mac?
Jacob Stamm
2
Para ser compatible con Mac también:if ((e.keyCode == 10 || e.keyCode == 13) && (e.ctrlKey || e.metaKey))
Ilya Manyahin
81

Solución universal

Esto también es compatible con macOS: se aceptarán tanto Ctrl+ Entercomo ⌘ Command+ Enter.

if ((e.ctrlKey || e.metaKey) && (e.keyCode == 13 || e.keyCode == 10)) {
    // do something
}
Serhii Matrunchyk
fuente
15
No ignore esta respuesta porque tiene una puntuación más baja, es solo una respuesta más nueva, en realidad es mejor.
David Bell
1
Explicación de la primera parte: En macOS, e.ctrlKeydetecta ⌃ Controly e.metaKeydetecta ⌘ Command. Use esto si desea que tanto Ctrl-Enter como Command-Enter activen el comportamiento.
Rory O'Kane
¿Puede explicar por qué acepta que una e.keyCodede 10significa Ingresar además de 13? La documentación de MDNkeyCode enumera solo 13como un valor posible para Enter, probado en múltiples navegadores y sistemas operativos.
Rory O'Kane
1
@ RoryO'Kane Algunas versiones de Chrome en Windows y Linux usan el valor 10, aparentemente.
Flimm
4

Encontré respuestas de otros incompletas o no compatibles con varios navegadores.

Este código funciona en google chrome.

$(function ()
{
    $(document).on("keydown", "#textareaId", function(e)
    {
        if ((e.keyCode == 10 || e.keyCode == 13) && e.ctrlKey)
        {
            alert('ctrl+enter');
        }
    });
});
Valamas
fuente
2
¿Podría considerar mejorar su respuesta agregando más explicaciones? Gracias :) De lo contrario, sería una respuesta de baja calidad a una pregunta de baja calidad.
Theolodis
@Valamas: ¿Puede decirnos cuál es el uso de "event.keyCode == 10" en su respuesta?
Shashank.gupta40
1
Me encanta copiar y pegar respuestas
Dr. Max Völkel
2

Esto se puede extender a un complemento JQuery simple pero flexible como en:

$.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);
            }
        })
    })
}

Así

$('textarea').enterKey(function() {$(this).closest('form').submit(); }, 'ctrl')

debe enviar un formulario cuando el usuario presiona ctrl-enter con el foco en el área de texto de ese formulario.

(Gracias a https://stackoverflow.com/a/9964945/1017546 )

joeln
fuente
0
$('my_text_area').focus(function{ set_focus_flag });

//ctrl on key down set flag

//enter on key down = check focus flag, check ctrl flag
idrum bueno
fuente
0

primero tienes que establecer una bandera cuando Ctrlse presiona, haz esto en la tecla entonces tienes que comprobar la tecla de entrar. desarme la bandera cuando vea una tecla para Ctrl.

mkoryak
fuente
0

Quizás un poco tarde para el juego, pero esto es lo que uso. También forzará el envío del formulario que es el objetivo actual del cursor.

$(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();
    }
});
Barry Chapman
fuente
Podría simplificar el " if... else if" a un solo if (e.ctrlKey && (e.keyCode == 10 || e.keyCode == 13)).
Rory O'Kane