Javascript

How to refresh a div at every 10 seconds using javascript

What is jQuery?

jQuery is a fast, small, and feature-rich JavaScript library. It makes things like HTML document traversal and manipulation, event handling, animation, and Ajax much simpler with an easy-to-use API that works across a multitude of browsers. With a combination of versatility and extensibility, jQuery has changed the way that millions of people write JavaScript.

 

Here we using two different Jquery function for Refresh a ‘div’ to load a file (
load.php) every 10 seconds.

 

html code:

Create a simple div for load a file

<div class="refresh">This will get Refreshed in Every 10 Seconds using 'everytTime()'</div>

scripts code:

everyTime() Method

A better approach is, to use setTimeout method along with a self-executing anonymous function.
<script language="javascript" src="jquery.timers-1.0.0.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$(".refresh").everyTime(1000,function(i){
$.ajax({
url: "loadTime.php",
cache: false,
success: function(html){
$(".refresh").html(html);
}
})
})
$ss('.refresh').css({color:"green"});
});
</script>

setInterval() Method

setInterval() us the method calls a function or evaluates an expression at specified intervals (in milliseconds).
The setInterval() method will continue calling the function until clearInterval() is called, or the window is closed. clearInterval() method used to expire specified intervals.
Tip: 1000 (milliseconds) = 1 second.
<script type="text/javascript">
  $("#waiting").show();
  var auto_refresh=setInterval(function(){$(".load").load("loadDate.php").fadeIn("fast");
    $("#waiting").hide()},1000) 
</script>

That’s it! I am sure this will help you make your own time interval function for live activities, Good luck.

Being Idea

Being Idea is a web platform of programming tutorials to make better programming skills and provides Software Development Solutions.

This website uses cookies.