Получение из value с опозданием

Что такое "получение из value с опозданием". Некоторые события при получении данных из value возвращают содержимое с задержкой в 1 символ(например keydown, keyup) или вообще ничего не возвращают, например paste.

О задержке получения из value или вообще не получение.

1. Почему происходит задержка либо не получение данных?
2. Пример задержки из value.
3. Как решить задержку из value.

Почему происходит задержка либо не получение данных?

Для того, чтобы понять, так почему же такое происходит... задержка получения из value в 1 символ или вообще не получение...?

Ответ: Почему происходит задержка либо не получение данных?

Ответ кроется в том, что те события, которые возвращают данные из value с задержкой или вообще не возвращают ничего происходят до попадания данных в value.

Пример Почему происходит задержка либо не получение данных?

Возьмем keydown:

Вы нажали кнопку на клавиатуре.

Вы получаете данные... из value, которых ещё нет...

И только после этого данные попали в value.

Ответа почему такое происходит - нет!

Да... я описал процесс, но почему такое происходит... это уже надо копать дальше... мне достаточно знать, что это работает именно так!

Разберем на примере, на живом, как это происходит:

Пример задержки из value.

Давайте теперь посмотрим на пример, где в живую увидим задержку в 1 символ:

У нас будет два тега input и div c id:

Выбираем способ обратиться к тегу по id.

Далее... соберем отслеживание нажатия на кнопку: addeventlistener + keydown + function.

Внутри:

innerHTML + getElementById + value в js.

Html

<input id="the_div">

<div id=demo></div>

Javascript

<script>

the_div.addEventListener("keydown", function(e) {

demo.innerHTML = document.getElementById("the_div"). value;

});

</script>

Живой пример задержки при получении данных?

Теперь разместим выше приведенный код прямо здесь, чтобы увидеть задержку получения данных из value - начните печатать и вы увидите, что данные получаем с задержкой в 1 символ!

Как решить задержку из value.

Для того, чтобы решить выше приведенную проблему вам понадобится setTimeout с любым значением... давайте поставим 1 тысячную...

Что будет происходить?.

setTimeout - позволит сделать задержку в 1 тысячную секунды, что достаточно, чтобы задержка получения данных из value исчезла:

Html

<input id="the_div_2">

<div id=demo_2></div>

Javascript

<script>

the_div_2.addEventListener("keydown", function(e) {

setTimeout(function() {

demo_2.innerHTML = document.getElementById("the_div_2"). value;

}, 1);

});

</script>

Пример ликвидации задержки данных из value.

Чтобы проверить... как будет работать код ликвидации задержки получения данных из value... анчните печатать...