После события вставки(paste) JavaScript

"получить данные после события вставки JS" - вы знали, что после того, как вы произвели вставку текста в поле ввода - его получить обратно в этот же самый момент нельзя!

Давайте с этим разберемся подробнее!

1. Как не работает получение данных в момент вставки js
2. Получаем данные после вставки js

Как не работает получение данных в момент вставки js

В самом начале первого пункта давайте сделаем некоторое отступление...

Казалось бы событие onpaste - оно(действие) должно быть аналогичным например событию

onkeydown или других аналогичный событиях!

НО! нет!

Конкретно о чем идет речь? Нам нужен пример... предположим самое простое... вам нужно каким-то образом обработать данные, которые попали в поле ввода, ну например подсчитать количество знаков... при выше перечисленных события в ссылках -это делается элементарно... но с "onpaste" - это не работает, не работает и всё!

Пример : как не работает получение данных в момент вставки js.

И далее создадим стандартную форму, в которой и посмотрим, как не работает получение данных в момент вставки js для этого вам понадобится:

Создадим простое поле ввода input.

В нем создадим id для обращения к этому полую ввода...

<input type="text" id="id_input">

Далее напишем кусочек js кода... воспользуемся одним из способов onpaste:

<script>
id_input.addEventListener('paste', function() {
alert( id_input.value )
});
</script>

Соберем весь код... и вставим на страницу...

Пример - как не работает получение данных в момент вставки js.

Для того, чтобы проверить - как не работает получение данных в момент вставки js вставьте какой-то текст в поле ввода... и проверьте, что вернет alert.




Получаем данные после вставки js

Выше я показал пример "как не работает получение данных в момент вставки js".

В данном пункте решим проблему - "получения данных в момент вставки js"... для этого вам понадобится:

Берем код из выше приведенного примера...

Добавляем в код задержку setTimeout... поставим 1 миллисекунду - это будет почти мгновенно...

Соберем весь код:

Код получения данных после вставки с помощью JavaScript

Соберем весь код вместе:

Html

<input type="text" id="id_input1">

Javascript

<script>

id_input1.addEventListener('paste', function() {

setTimeout(function() {

alert( id_input1.value )

}, 1);

});

</script>

Пример получения данных после вставки с помощью JavaScript

Размещаю приведенный код, прямо здесь.

Для того, чтобы проверить как работает получение данных после вставки... скопируйте какой-то текст и вставьте в ниже идущее поле ввода...