jQuery setInterval & setTimeout function

jQuery setInterval & setTimeout function

jQuery settimeout and setinterval; In this tutorial, you will learn how to use set an interval time using jQuery setTimeout(seconds) & setInterval(seconds) methods.

When you work with jQuery, You must know some of the basic jQuery function. It functions very helpful for web development.

jQuery setInterval & setTimeout function

Here are setTimeout and setInterval function with examples:

  • setTimeout
  • setInterval

About jQuery setTimeout Method

The setTimeout function executes a script code after a specified delay (in milliseconds).

Syntax of jQuery setTimeout Method

setTimeout(function, milliseconds);

Example of setTimeout method

This example will demostrate you how use this setTimeout function.

<!DOCTYPE html>
<html>
<head>
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script> 
<script>
$(document).ready(function(){
    $("#btn-timout").click(function(){
       setTimeout("alert('Hello World!');", 4000);
    });
});
</script>
</head>
<body>
<div class="common_box_body">
<button id="btn-timout">Click</button>
<p>Click the above given button and wait for 4 seconds. After 4 second will come alert box</p>
</div>
</body>
</html>

Output

Click the above given button and wait for 4 seconds. After 4 second will come alert box

About jQuery setInterval Method

The jQuery setInterval function can be used to continue any work by using a regular time-based trigger.

Syntax of setInterval Method

setInterval(function, milliseconds);

Example of setInterval method

This example will demostrate you how use this setInterval function.

<!DOCTYPE html>
<html>
<head>
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script> 
<script>
$(document).ready(function(){
    $("#btn-interval").click(function(){
       setInterval("alert('Hello World!');", 4000);
    });
});
</script>
</head>
<body>
<div class="common_box_body">
<button id="btn-interval">Click</button>
<p>Click the above given button and wait for 4 seconds. After 4 second will come alert box continuously</p>
</div>
</body>
</html>

Output

Click the above given button and wait for 4 seconds. After 4 second will come alert box continuously

To Remember

The setInterval function performs again and again in the given interval time.
The setTimeout function is executed only once in given intervals time. In both functions, 1000 ms = 1 seconds.

Recommended jQuery Tutorial

  1. jQuery | Event MouseUp () By Example
  2. Event jQuery Mouseleave By Example
  3. jQuery Event Mouseenter Example
  4. Event jQuery MouseOver() & MouseOut By Example
  5. keyup jquery event example
  6. Jquery Click() Event Method with E.g.
  7. Event jQuery. Blur By Example
  8. jQuery form submit event with example
  9. keydown function jQuery
  10. List of jQuery Events Handling Methods with examples
  11. Jquery Selector by .class | name | #id | Elements
  12. How to Get the Current Page URL in jQuery
  13. jQuery Ajax Get() Method Example
  14. get radio button checked value jquery by id, name, class
  15. jQuery Set & Get innerWidth & innerHeight Of Html Elements
  16. jQuery Get Data Text, Id, Attribute Value By Example
  17. Set data attribute value jquery
  18. select multiple class in jquery
  19. How to Remove Attribute Of Html Elements In jQuery
  20. How to Checked Unchecked Checkbox Using jQuery
  21. jQuery removeClass & addClass On Button Click By E.g.
  22. To Remove whitespace From String using jQuery
  23. jQuery Ajax Post() Method Example
  24. jQuery Ajax Get() Method Example
  25. To Load/Render html Page in div Using jQuery Ajax $.load

AuthorAdmin

My name is Devendra Dode. I am a full-stack developer, entrepreneur, and owner of Tutsmake.com. I like writing tutorials and tips that can help other developers. I share tutorials of PHP, Python, Javascript, JQuery, Laravel, Livewire, Codeigniter, Node JS, Express JS, Vue JS, Angular JS, React Js, MySQL, MongoDB, REST APIs, Windows, Xampp, Linux, Ubuntu, Amazon AWS, Composer, SEO, WordPress, SSL and Bootstrap from a starting stage. As well as demo example.

Leave a Reply

Your email address will not be published. Required fields are marked *