How to call a function automatically after waiting for some time in jQuery

Topic: JavaScript / jQuery« Prev|Next »

Answer: Use the jQuery delay() method

The following example will show you how to call a function after waiting for some time. The example uses the jQuery delay() method to set the time interval for the delay.

  • <!DOCTYPE html>
  • <html lang="en">
  • <head>
  • <meta charset="utf-8">
  • <title>jQuery Execute a Function after Certain Time</title>
  • <style type="text/css">
  •     img{
  •         display: none;
  •     }
  • </style>
  • <script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
  • <script type="text/javascript">
  • function showImage(){
  •     $("img").fadeIn(500);
  • }
  • $(document).ready(function(){ 
  •     $(".show-image").click(function(){
  •         $(this).text('loading...').delay(1000).queue(function() {
  •             $(this).hide();
  •             showImage(); //calling showimage() function
  •             $(this).dequeue();
  •         });        
  •     });
  • });
  • </script>
  • </head>
  • <body>
  •     <button type="button" class="show-image">Show Image</button>
  •     <img src="../images/kites.jpg" alt="Flying Kites">
  • </body>
  • </html>

Related FAQ

Here are some more FAQ related to this topic:

 
Close

Your Feedback:

 

We would love to hear from you! Please say something.