Ctrl + Введіть jQuery в TEXTAREA


92

Як мені щось активувати, коли курсор знаходиться в межах TEXTAREA і натиснуто Ctrl+ Enter? Використання jQuery . Дякую


відповідь, яку ви прийняли, не працює. Будь ласка, змініть прийняту відповідь
peterchaula

Відповіді:


128

Ви можете використовувати event.ctrlKeyпрапор, щоб побачити, чи натиснута Ctrlклавіша, приблизно так:

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

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

Перевірте наведений фрагмент тут .


15
Це не працює в Google Chrome. Коли натиснуто Ctrl + Enter, код клавіші - 10ні 13.
Знаркус

39
Це не працює. Розв’язання Яролслава Яковлєва працює належним чином. Будь ласка, змініть прийняту відповідь, щоб заощадити час.
Філ Рікеттс,

1
@Replete Яке середовище ви протестували? Чи є документація щодо keyCode 10?
Sanghyun Lee

keyCode 10 більше не повинен відбуватися в Chrome, див. bugs.chromium.org/p/chromium/issues/detail?id=79407
swissspidy

при спрацьовуванні keypressподії код клавіші буде 10, але keydownабо keyupповідомлятиме 13. Тільки тестувати хром
iulo

137

Насправді цей робить трюк і працює у всіх браузерах:

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

посилання на скрипку js .

Примітки:

  • У Chrome для Windows та Linux enterбуде зареєстровано як keyCode10, а не 13 ( звіт про помилку ). Тож нам потрібно перевірити будь-який.
  • ctrlKeyє controlна Windows, Linux та macOS (не command). Дивіться також metaKey.

Скрипка не працює у Firefox 27, що не так?
CodeManX

4
@ Ярослав: Скажіть, будь ласка, яка користь від "event.keyCode == 10" у вашій відповіді.
Shashank.gupta40,

3
Якщо хтось все ще цікавиться ключовим кодом 10 та іншими хромованими матеріалами, прочитайте це .
user2422869

1
@YaroslavYakovlev дійсно ctrlKeyвідповідає клавіші Command на Mac?
Jacob Stamm

2
Для підтримки Mac також:if ((e.keyCode == 10 || e.keyCode == 13) && (e.ctrlKey || e.metaKey))
Ілля Манягін

81

Універсальне рішення

Це також підтримує macOS: прийматимуться як Ctrl+, так Enterі ⌘ Command+ Enter.

if ((e.ctrlKey || e.metaKey) && (e.keyCode == 13 || e.keyCode == 10)) {
    // do something
}

15
Не ігноруйте цю відповідь, оскільки вона має нижчий бал, це просто нова відповідь, вона насправді краща.
Девід Белл

1
Пояснення першої частини: На macOS e.ctrlKeyвиявляє ⌃ Controlта e.metaKeyвиявляє ⌘ Command. Використовуйте це, якщо ви хочете, щоб Ctrl-Enter і Command-Enter ініціювали поведінку.
Рорі О'Кейн,

Можете чи ви пояснити , чому ви приймаєте e.keyCodeз 10означає Enter на додаток до 13? У MDN keyCodeдокументації наведені тільки в 13якості можливого значення для Enter, випробувані в різних браузерах і операційних системах.
Рорі О'Кейн,

1
@ RoryO'Kane Деякі версії Chrome у Windows та Linux, мабуть, використовують значення 10.
Флімм

4

Я знайшов відповіді інших або неповними, або несумісними між браузерами.

Цей код працює Google Chrome.

$(function ()
{
    $(document).on("keydown", "#textareaId", function(e)
    {
        if ((e.keyCode == 10 || e.keyCode == 13) && e.ctrlKey)
        {
            alert('ctrl+enter');
        }
    });
});

2
Чи можете ви покращити свою відповідь, додавши додаткові пояснення? Дякую :) Інакше це була б просто неякісна відповідь на запитання низької якості.
Теолодис

@Valamas: Скажіть, будь ласка, яка користь від "event.keyCode == 10" у вашій відповіді.
Shashank.gupta40,

1
Я люблю відповіді на копіювання та наклеювання
доктор Макс Волкель,

2

Це можна поширити на простий, але гнучкий плагін 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, фокусуючись на текстовому полі цієї форми.

(Завдяки https://stackoverflow.com/a/9964945/1017546 )


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

0

спочатку вам потрібно встановити прапор при Ctrlнатисканні, зробіть це на клавіші вниз. тоді вам потрібно перевірити клавіатуру Enter. зніміть прапор, коли побачите клавіатуру для Ctrl.


0

Можливо, трохи пізно в гру, але ось що я використовую. Він також змусить подати форму, яка є поточною метою курсору.

$(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)).
Рорі О'Кейн,
Використовуючи наш веб-сайт, ви визнаєте, що прочитали та зрозуміли наші Політику щодо файлів cookie та Політику конфіденційності.
Licensed under cc by-sa 3.0 with attribution required.