Как убрать возможность кликнуть много раз?

Question

[lb-web]

$( ".menu-open" ).click(function() {
    $( ".hidden-menu" ).animate({
    left: "+=295"
  }, 1000, function() {
    // Animation complete.
  });
    $( ".menu-open" ).animate({
    opacity: 0
  }, 1000, function() {
    // Animation complete.
  });
});

Есть такой код. Если много раз нажать на кнопку .menu-open, то соотв. проанимируется на +100500 пикселей за каждое нажатие.

Answer 1

[Ihor Bratukh]

Debounce

$('.menu-open').on('click', debounce(function(event) {
	console.log(this);
}, 500));

function debounce(func, wait, immediate) {
	var timeout;
	return function() {
		var context = this;
		var args = arguments;
		var later = function() {
			timeout = null;
			if (!immediate) func.apply(context, args);
		};
		var callNow = immediate && !timeout;
		clearTimeout(timeout);
		timeout = setTimeout(later, wait);
		if (callNow) func.apply(context, args);
	}
}

Comments

[lb-web]

вчера как раз посоветовали эту функцию, ваше решение подходит..спасибо

Answer 2

[profesor08]

Ну так останавливай анимацию.
$( ".hidden-menu" ).stop().animate(...)

Либо введи некий флаг индикатор, который включается если идет анимация, и если он true, то не делай ничего.

Answer 3

[j n]

При включении анимации навешивай на меню класс - например, active.

Внутри функции анимации проверяй, есть ли у меню класс active. Если нет, то запустить анимацию, если да, то остановить анимацию или запустить её в обратную сторону.