Как заставить работать settimeout с нужным значением?

Question

[Andrey Dyrkov]

Я создаю поиск, при клике по клавише клавиатуры срабатывает событие keyup в функции initialize. В ней получаеться значение поле куда вводят поисковую строку и оно отправляеться на сервер с помощью функции send. Но прежде чем отправить запрос на сервер необходимо проверить изменилось ли значение в поле через 800мс. Это не получается сделать тк. переменная постоянно перезаписывается и я сравниваю несколько раз одно и тоже значение в итоге(если уменьшить до 1мс то всё ок). Мне нужно чтобы settimeout проверял значение которое я передал когда-то, с текущим. Но такогово не происходит, если бытро печатать то за эти 800 мс она переменная перезапишеться много раз и будет сверяться не то значение. Я пытался стеки делать и чего только не пытался. Помогите))

Я думал что передав в settimeout значение всё будет работать нормально, но нет((

var ajax = require('./ajax.js'),
		query = require('./query.js');

//global variablse;
var mainBox = $('.search-fild'),
		fild = mainBox.children('.main-search'),
		result = mainBox.children('.result-search'),
		sbtn = mainBox.children('.input-group-btn').children('button'),
		black = mainBox.children('.black');

function initialize(){
	/*
		Инициализирует search модуль на странице
	*/

	//INPUT
	fild.keyup(function(){
		var value = $(this).val();

		result.children('.result-item').remove();

		send(value);

	});
}

function renderResultItems(data){
	for(var i = 0, l = data.length; i<l;i++){
		result.append('<div class="result-item"> ( '+data[i].ID+' ) '+data[i].COMENT+' </div>');
	}

}

function send(val){

	if(val.length>=3){
		console.log('[send] val:'+val);
		setTimeout('time( "'+val+'" )',800);
	}else{
		result.children('.result-item').remove();
	}

	

}

window.time =function(val){
		console.log('[time] val:'+val+' fildval:' + fild.val());
		if(val===fild.val()){
			ajax.search(val);
		}
};
module.exports.init = initialize;
module.exports.renderItems = renderResultItems;

Answer 1

[Aves]

Насколько я понял, нужно сделать отправку не чаще, чем раз в 800мс и только если значение изменилось, тогда примерно так:

var lastsend, lastval, timer;
var input = document.querySelector('input');
var output = document.querySelector('#output');

input.addEventListener('keyup', function() {
    send(this.value);
});

function send(val) {
    clearTimeout(timer);
    var d = Date.now() - lastsend;
    if (d < 2000) {
        timer = setTimeout(function() {
            send(val);
        }, d);
        return;
    }
    if (val != lastsend) {
        output.innerText = lastval = val;
        lastsend = Date.now();
    }
}

jsbin.com/torubu/embed

Comments

[Andrey Dyrkov]

Спасибо, я просто даже и не подумал о использовании date)

Answer 2

[Alex XYZ]

Зачем вам settimeout, если нужно определить определить разницу во времени между двумя событиями? new Date() не годится?

Comments

[Andrey Dyrkov]

У меня решение было всего одно, я хотел при клике вызвать callback settimeoout и он проверялбы значение, но не получалось. Спасибо за ответ)