Timeout ajax запроса?

Question

[Артур Ялалтдинов]

Имеется функция которая выполняет ajax запрос по нажатию на кнопку.

function LoadQuest()
{
	$.ajax({
		type: "POST",
		url: "/ajax/",
		data: {
			's_id': s_id,
			'member_id': member_id,
			'param': 'LoadQuest'
		},
		error: function()
		{
			document.getElementById('load_button').innerHTML = '<button type="button" tkey="loadmore_button">'+load_more+'</button>';
			console.log(3);
		},
		beforeSend: function()
		{
			document.getElementById('load_button').innerHTML = '<button type="button" onClick="LoadQuest()">\
																	<div class="sk-spinner sk-spinner-wave">\
																		<div class="sk-rect1"></div>\
																		<div class="sk-rect2"></div>\
																		<div class="sk-rect3"></div>\
																		<div class="sk-rect4"></div>\
																		<div class="sk-rect5"></div>\
																	</div>\
																</button>';
		},
		success: function(msg)
		{
			console.log(0);
			msg = jQuery.parseJSON(msg);
			if(msg['error'] == true)
			{
				document.getElementById('load_button').innerHTML = '<button type="button" tkey="error_14">'+msg['text']+'</button>';
				console.log(1);
			}
			else
			{
				for(var i = 0; i < count(msg); i++)
				{
					console.log(2);
					message += '<div class="footer">\
									<div class="title">'+msg[i]['q_title']+'</div>\
									<div class="quest-content">'+msg[i]['q_text']+'</div>\
								</div>\
								<div class="clearfix"></div>';
					sid = msg[i]['q_id'];
				}
				s_id = sid;
				document.getElementById("quest").innerHTML = message;
				document.getElementById('load_button').innerHTML = '<button type="button" onClick="LoadQuest()" tkey="loadmore_button">'+load_more+'</button>';
			}
		}
	});
}

Как предотвратить флуд нажатия на кнопку? т.к в базу отправляются запросы. Пробовал timeout не получается или я не то делаю или код работать не хочет.

Answer 1

[DevMan]

уберите на время запроса click-хэндлер у кнопки.

Comments

[Артур Ялалтдинов]

То есть? у меня эта функция вызывается по нажатию на кнопку
'+load_more+'
LoadQuest естественно вызывает function LoadQuest

[Артур Ялалтдинов]

Мне нужно чтобы на кнопку можно было нажать раз в 3-5 секунд.

[DevMan]

crazy_str: так что надо блокировать? клик на '+load_more+' или на 'LoadQuest'?

[Артур Ялалтдинов]

DevMan: LoadQuest наверно я так думаю =D мне главное чтобы в базу запросами не флудили.

[DevMan]

crazy_str: ну так и делайте что я написал в самом начале: уберите onClick="LoadQuest()" в beforeSend и добавьте хэндлер в success.
таким образом клик по кнопке не будет работать пока не завершиться запрос.

[Артур Ялалтдинов]

DevMan: https://youtu.be/BI6ZGQP9m58 я и говорю что запрос почти моментальный мне нужно предотвратить флуд нажатия на LoadQuest аля load_more.

[Артур Ялалтдинов]

Что бы на кнопку загрузить ещё можно было нажать раз в 3-4 секунды.

[DevMan]

crazy_str: вот вам пример задержки в 5 секунд jsfiddle.net/gmczsma7

[DevMan]

crazy_str: пример попроще jsfiddle.net/gmczsma7/1

Answer 2

[mr-molodoy]

Можно кучей способов.

1. 
   Убрать обработчик с события click
   

   var $button = $("button#send-ajax");
   function clickHandler () {
       // Отправка Ajax
       // ...
   
       // Отключаем обработку события клика
       $button.off('click'); 
   
       // Включаем через 3 секунды
       setTimeOut(function () { $button.on('click', clickHandler); }, 3000);
   }
   
   // Включаем обработчик события
   $button.on('click', clickHandler)

   
   
   
2. При нажатии проверяем переменную времени последнего клика, если времени прошло более 3-5 сек. выполняем запрос и обновляем время в переменной.
   
3. По аналогии с первым примером, только спрятать кнопку на время вместо удаления обработчика