CODEWITHSUNDEEP
javascript
GobsRuiz
GobsRuiz

Reputation: 522

How to stop or pause a click event for a period of time after click?

I made a carousel and I need that after a click, wait a few seconds to be executed again. I need to pause this button after it is clicked.

Why the way I did it, when it gets to a certain point, has to wait for the rest of the code to run before clicking again, because if you click on the code before it runs, it doesn't work. Anyway, I just want to know if there is any way!

Upvotes: 2

Views: 941

Answers (2)

Spectric
Spectric

Reputation: 31987

Here's a demo:

var lastTimeout;

function func(e) {
  if (lastTimeout != null) {
    clearTimeout(lastTimeout);
  }
  if (!e.classList.contains("disabled")) {
    console.log("Please wait 3 seconds before clicking again");
    e.classList.add("disabled");
    setTimeout(function() {
      e.classList.remove("disabled");
    }, 3000);
  }
}
.disabled {
  pointer-events: none;
  user-select: none;
  opacity: 0.5;
}
<button onclick="func(this)">Click</button>

Upvotes: 1

Sullivan Tobias
Sullivan Tobias

Reputation: 152

You can put a timeout function

Disable the button with css.

Enable the class when clicked, and removed it using the timeout

Upvotes: 2

Related Questions