Есть ли какое-либо событие между нажатием клавиши и нажатием клавиши в JavaScript?

Question

У меня есть ситуация, когда мне нужно перехватывать каждую клавишу, нажимаемую на div contentEditable.Но когда произойдет событие нажатия клавиши, если я это сделаю,

document.getElementById("divEditor").innerHTML

Не могу получить полный текст (не нажимается последний символ)

Кроме того, событие keyup не срабатывает при непрерывном нажатии клавиш.Что я могу сделать, чтобы ключевое событие имело полное значение?

Answer 1

keyup это единственное событие, которое позволяет увидеть состояние после нажатия клавиши.

Один из подходов – поймать keydown и установите тайм-аут для выполнения некоторой обработки после нажатия клавиши:

input.onkeydown= function() {
    setTimeout(function() {
        // do something
    }, 1);
};

Однако, если редактирование также возможно без нажатия клавиши (а обычно это происходит с помощью перетаскивания и таких пунктов меню, как вырезание и вставка), никакая проверка событий клавиш не поможет.Вместо этого вы должны просто опросить состояние, чтобы увидеть, изменилось ли оно.Вы можете поддержать это с помощью обработчика нажатия клавиши или тайм-аута нажатия клавиши, чтобы ускорить обновление этого конкретного случая.

var oldstate= input.value;
function checkState() {
    if (input.value!=oldstate) {
        // do something
        oldstate= input.value;
    }
}
setInterval(checkState, 1000);
input.onkeyup= checkState;

(Для простоты здесь используется элемент input, но он в равной степени применим и к contentEditable.)

Answer 2

как насчет onblur()?вам понадобятся две функции: функция нажатия клавиши, а затем вызов onblur(), когда фокус покинул текстовое поле.Это должно дать вам доступ к остальной части текста.

Answer 3

Кажется, лучше всего было бы иметь поле INPUT (position:absolute; left:-1000px) и добавьте все 3 события (keydown keypress keyup) к этому.

Теперь вы можете использовать значение этого поля ввода, CTRL + Z работает, и вы можете вставлять значения.

Все, что вам нужно сделать, это установить фокус на поле ввода.

var user_action = function ()
{
   document.getElementById("divEditor").innerHTML =    document.getElementById("myhiddenInput").value;
};

document.getElementById("myhiddenInput").onchange = user_action;
document.getElementById("myhiddenInput").onkeydown  = user_action;
document.getElementById("myhiddenInput").onkeyup    = user_action;
document.getElementById("myhiddenInput").onkeypress = user_action;

document.getElementById("divEditor").onclick = document.getElementById("myhiddenInput").focus;