Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 25.11.2020, 01:03
Интересующийся
Отправить личное сообщение для eLDeR Посмотреть профиль Найти все сообщения от eLDeR
 
Регистрация: 28.05.2019
Сообщений: 23

Обработка oninput
Доброго времени суток, господа.

Есть код, который обрабатывает ввод... он делает это столько раз, сколько было введено символов с задержкой 3000.

Нужно что бы код выполнялся спустя 3 сек после последнего введенного символа

document.addEventListener('DOMContentLoaded', function () {
	var codeinpit = document.querySelector('#promo');
	var price = document.getElementById('price');
	codeinpit.oninput = function () {
			code = this.value;
			function wait() {
				const request = new XMLHttpRequest();
				const url = "../action/code.php?code=" + code;
				request.open('GET', url); 
				request.setRequestHeader('Content-Type', 'application/x-www-form-url');
				request.addEventListener("readystatechange", () => {
					if (request.readyState === 4 && request.status === 200) {
						console.log( request.responseText );
					}
				});
				request.send();
//				price.innerHTML = code;
			}
			setTimeout(wait, 3000);
		}
});
Ответить с цитированием
  #2 (permalink)  
Старый 25.11.2020, 01:08
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

eLDeR,
создайте переменную для таймера строка 3 и обнуляйте в строке 19
Ответить с цитированием
  #3 (permalink)  
Старый 25.11.2020, 02:26
Интересующийся
Отправить личное сообщение для eLDeR Посмотреть профиль Найти все сообщения от eLDeR
 
Регистрация: 28.05.2019
Сообщений: 23

Я не очень разбираюсь в JS этот код я писал день, ссылаясь на всякие источники.. если вы мне подскажите как его дописать, буду благодарен
Ответить с цитированием
  #4 (permalink)  
Старый 25.11.2020, 08:34
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

eLDeR,
document.addEventListener('DOMContentLoaded', function () {
	let codeinpit = document.querySelector('#promo');
	let price = document.getElementById('price');
    let timer;
	codeinpit.oninput = function () {
            window.clearTimeout(timer);
			let code = this.value;
			function wait() {
				const request = new XMLHttpRequest();
				const url = "../action/code.php?code=" + code;
				request.open('GET', url);
				request.setRequestHeader('Content-Type', 'application/x-www-form-url');
				request.addEventListener("readystatechange", () => {
					if (request.readyState === 4 && request.status === 200) {
						console.log( request.responseText );
					}
				});
				request.send();
//				price.innerHTML = code;
			}
			timer = setTimeout(wait, 3000);
		}
});
Ответить с цитированием
  #5 (permalink)  
Старый 25.11.2020, 09:37
Профессор
Отправить личное сообщение для Rise Посмотреть профиль Найти все сообщения от Rise
 
Регистрация: 07.11.2013
Сообщений: 4,662

eLDeR,
Возможно тебе throttle-декоратор нужен:
codeinpit.oninput = throttle(request, 3000);
Ответить с цитированием
  #6 (permalink)  
Старый 25.11.2020, 10:56
Аватар для voraa
Профессор
Отправить личное сообщение для voraa Посмотреть профиль Найти все сообщения от voraa
 
Регистрация: 03.02.2020
Сообщений: 2,692

Сообщение от Rise
Возможно тебе throttle-декоратор нужен:
Скорее уж debounce
https://habr.com/ru/post/60957/
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Как в oninput получить значения select? Jeick9 Events/DOM/Window 9 11.10.2014 20:18
Обработка нажатия на элемент и его родитель klev2004 Общие вопросы Javascript 3 12.12.2012 20:07
jqGrid. локальная обработка данных DarkN jQuery 0 25.01.2011 23:55
onpropertychange и oninput mat_ppc Общие вопросы Javascript 10 10.12.2010 11:45
Обработка фото сервером. mycoding Оффтопик 0 12.10.2010 22:45