Слушайте нажатие клавиши Enter в Quill.js

Согласно документации, Quill может обрабатывать клавишу Enter, но я не могу заставить ее работать.

Я выполнил следующие шаги, перечисленные на их сайте:

  1. Импорт модуля клавиатуры: const Keyboard = Quill.import('modules/keyboard'); документация по импорту расширения Quill.js.
  2. Добавьте пользовательское событие, называемое привязкой клавиш. Документация по привязке клавиш Quill.js
  3. Вызов функции для обработки события.

Мой код следующий:

quill.keyboard.addBinding({ key: Keyboard.keys.ENTER, handler: function(range, context) { console.log('Enter Key!!!'); result.innerText = 'Key presset = ENTER'; } })

Пример кода

Я пробовал Chrome (последняя версия) и Safari 11.0.3 на MacOS High Sierra 10.13.3.


javascript quill
person Eduardo Alvarez    schedule 13.02.2018    source источник

Ответы (2)


arrow_upward
4
arrow_downward

Не уверен, нужна ли вам клавиша Enter или клавиша пробела, но вы были на нужной странице с модулем клавиатуры но пропустил это ключевое предложение:

key — это код клавиши события JavaScript, но для буквенно-цифровых клавиш и некоторых общих клавиш разрешены строковые сокращения.

Таким образом, вы можете указать либо 13, либо «ввод», если вы имели в виду клавишу «Ввод», или 32, если вы имели в виду клавишу «Пробел» (к сожалению, для клавиши «Пробел» нет сочетания клавиш).

Предстоящая версия 2.0 (без общедоступной временной шкалы) также будет поддерживать новый более простой в использовании KeyboardEvent.key, но в настоящее время вы должны использовать keyCode .

person jhchen    schedule 13.02.2018
comment
Привет Йохен, спасибо за быстрый ответ. По сути, мне нужна клавиша Enter. En в посте я скопировал не тот обработчик событий, но в ссылке на скрипт JS есть весь скрипт. - person Eduardo Alvarez; 14.02.2018
comment
Привет, я пробовал с ключом: 13 и ключом: «ввод», но не повезло. Копия примера кода с обновленными слушателями находится здесь [ссылка] (jsfiddle.net/el_alien/qqjekxch) - person Eduardo Alvarez; 14.02.2018
comment
Также прямо на странице документации по клавиатуре: Примечание. Поскольку обработчики Quill по умолчанию добавляются при инициализации, единственный способ предотвратить их — добавить свой в конфигурацию. Так что вам придется сделать это вместо использования addBinding. Quill делает это для ряда ключевых событий, чтобы нормализовать поведение браузера и исправить ошибки, так что это меняется с выпусками браузера. - person jhchen; 23.02.2018
comment
Спасибо за ваше продолжение, я попробую предложенное вами решение и вернусь с результатами. - person Eduardo Alvarez; 23.02.2018
comment
Как вы в итоге решили это? - person FrankTheTank; 05.03.2018
comment
Чтобы отключить клавишу Enter (код клавиши 13): configToolbar.keyboard.bindings.handleEnter = { key: 13, handler: () => { return false; } }; - person kortex; 07.09.2018

arrow_upward
3
arrow_downward

Вот как предотвратить всплывание клавиши ввода в будущем. Вы должны сначала поставить свой обработчик, а затем вернуть true, если хотите продолжить всплытие.

quillEditor.keyboard.bindings[13].unshift({
        key: 13,
        handler: (range, context) => {
            if (this.popupVisible) {
                return false;
            }
            return true;
        }
    });
person Chris Fremgen    schedule 09.09.2020