Отмена click на 5 секунд

108

04 апреля 2021, 08:20

Ломаю себе голову уже второй час. Может кто поможет:

$('#mybtn').click(function() { 
  myfunc(); 
}); 
 
function myfunc() { 
 
  console.log('запустили функцию') 
 
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> 
<button id="mybtn" class=""><h1>кнопка</h1></button>

Мне нужно сделать так, чтобы console.log запускался при условии, что прошло не меньше 5 секунд с первого запуска функции. Хочу это сделать внутри myfunc()

Тоесть человек кликает на кнопку #mybtn, функция выполняется, дальше если человек еще 10 раз кликает на кнопку на протяжении 5 секунд то ничего не срабатывает. Функция начинает работать опять через 5 секунд, и с таким интервалом.

Помогите, а)

Answer 1

Все что нужно это, это отключит кнопку, зачем ее кликать.

 this.disabled = true;
  setInterval(() => {
    this.disabled = false;
  }, 5000);

$('#mybtn').click(function() { 
  myfunc(); 
  this.disabled = true; 
  setInterval(() => { 
    this.disabled = false; 
  }, 5000); 
}); 
 
function myfunc() { 
 
  console.log('запустили функцию') 
 
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> 
<button id="mybtn" class=""><h1>кнопка</h1></button>

Answer 2

mybtn_enabled = true; 
$('#mybtn').click(function() { 
    myfunc(); 
}); 
 
function myfunc(){ 
  if (mybtn_enabled) { 
    mybtn_enabled = false; 
    setTimeout(function(){ 
      mybtn_enabled = true; 
    }, 5000); 
    console.log('запустили функцию'); 
  } 
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> 
<button id="mybtn" class=""><h1>кнопка</h1></button>

Answer 3

Пока флаг свободен - производим действия, ставим флаг, по таймеру освобождаем флаг. Если флаг занят - ничего не делаем.


    var flag = true;
    function myfunc(){
      if(flag) { 
        console.log('запустили функцию');
        flag = false;
        setTimeout(function() {
          flag = true; 
        }, 5000);
      }
    }

Answer 4

Добавьте в список переменных значение time и используйте таймер

Я могу ошибаться, но вроде, это будет работать:

var time = true; 
 
$('#mybtn').click(function() { 
    if (time = true) myfunc(); 
}); 
 
function myfunc(){ 
	 
  console.log('запустили функцию') 
  time = false; 
  setTimeout(function(){time = true;}, 5000); 
 
}