In my code the button .getmore gets clicked on scroll down. It loads data from database.Works fine. I need to make it disable for 5 sec after every click. How can I set this delay timer?

Or is it possible to disable this function for 5 sec once it fires? Disable the button or disable the function anything will work for me.

$(window).scroll(function(){
    if ($(document).height() <= $(window).scrollTop() + $(window).height()) {
        // Here how can i set a delay time of 5 sec before next click 
        $('.getmore').click(); 
    }
});

In my code the button .getmore gets clicked on scroll down. It loads data from database.Works fine. I need to make it disable for 5 sec after every click. How can I set this delay timer?

Or is it possible to disable this function for 5 sec once it fires? Disable the button or disable the function anything will work for me.

$(window).scroll(function(){
    if ($(document).height() <= $(window).scrollTop() + $(window).height()) {
        // Here how can i set a delay time of 5 sec before next click 
        $('.getmore').click(); 
    }
});

• javascript
• jquery

• Although I know what you are trying to achieve, wouldn't be better to add an event listener rather than using a fixed amount of time and keep the button disabled until the server responds? – AndreFeijo Commented Jan 24, 2017 at 22:13
• use setTimeout(function(){$('.getmore').click(); },"5000") – K D Commented Jan 24, 2017 at 22:14

4 Answers 4

You can use setTimeout() function of jQuery.

 $('.getmore').prop('disabled', true);
 setTimeout(function() {
       $('.getmore').prop('disabled', false);
 }, 5000);

One solution is to use setTimout and disable the button with javascript using document.getElementById("yourButtonID").disabled = true;

You could use a flag inside the clickHandler:

var clickHandler = () => {
  if (clickHandler.running)
    return
  
  clickHandler.running = true
  setTimeout(() => { clickHandler.running = false }, 5000)
  
  console.log(new Date())
  }

$('#getmore').click(clickHandler)

<script src="https://ajax.googleapis./ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id='getmore'>more</div>

U can use setTimeout() n after that, put ur disable button function inside it.

setTimeout(document.getElementById('ur_button_id').style.display = 'none', 500);