How to auto load the page in div every 5 seconds

Now a days we are seen many websites are fetch the data without page refresh.
If you want to load the page auto in div by using jquery. It is possible by using the setInterval() here you can mention the auto load page and time.
Then you are defined the page will load the certain amount of time as you set in the function.
This page content will be load in a div.


Please wait ..

Then set the auto load page and time interval in setInterval().

You need to load the jquery.min.js file.

Your auto load page contains either static data or dynamic data.

index.php

 <html>  
 <head>  
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.3.0/jquery.min.js"></script>  
 <script>  
 setInterval(  
 function()  
 {  
 $('#content').load('load.php');  
 }, 3000);  
 </script>  
 <style>  
 #content{  
 background-color:#00A1E0;  
 font-size:24px;  
 font-weight:bold;  
 padding-top:10px;  
 color:#fff;  
 min-height: 200px;  
 }  
 #content,h1{  
      text-align: center;  
 }  
 </style>  
 <title>Auto Load Page in Div using Jquery</title>  
 </head>  
 <body>  
 <h1>Auto Load Page in Div</h1>  
 <div id="content"> Please wait .. </div>  
 </body>  
 <html>

load.php

 <?php  
 echo 'This content is loaded via ajax in every 5 seconds ..';  
 ?>

Download Watch Demo

* If you like this post please don’t forget to subscribe Techies Badi - programming blog for more useful stuff

How to auto load the page in div every 5 seconds

Share this