O'Reilly

Automatically Refresh a Page Using JavaScript or Meta Tags

By on  

I try to steer clear of modifying a page without the user triggering the change, much less automatically refresh or redirect a page. There are times when automatically refreshing the page is important, like when you pull up game play-by-play pages on NFL.com or ESPN.com. Whatever your reason for automatically refreshing the page, keep one thing in mind: auto-refresh only pages that have little interaction -- nothing more than a click.

The JavaScript Method

var timer = null;
function auto_reload()
{
	window.location = 'http://domain.com/page.php';
}
	
	 <body onload="timer = setTimeout('auto_reload()',10000);">

The META Tag Method

The following refreshes the page every 30 seconds.

<head>
<meta http-equiv="refresh" content="30" />
</head>
Track.js Error Reporting

Upcoming Events

Recent Features

Incredible Demos

  • Google Font API

    Google recently debuted a new web service called the Font API.  Google's Font API provides developers a means by which they may quickly and painlessly add custom fonts to their website.  Let's take a quick look at the ways by which the Google Font...

  • HTML5 Input Types Alternative

    As you may know, HTML5 has introduced several new input types: number, date, color, range, etc. The question is: should you start using these controls or not? As much as I want to say "Yes", I think they are not yet ready for any real life...

Discussion

  1. Ed Burrow

    I use a refresh feature in Firefox 3.0 (it’s an add-in) that allows me to set a refresh time for a page from 30 secs to unlimited minutes. I was wondering if you know of a program or add-in for IE7 (and now IE8) that would allow me to do same kind of thing.

    Thanks

    WldHogn

  2. vishal

    hi i am trying to reset counter after time interval and restart automatically. your code runs properly but it will post back if i want to avoid postback then what to do…
    thanku

  3. Mounica

    hi…..

    In my project the cascading style sheet is not working properly. So i thought of onload page refresh . So, can u please help me out with some code or any other stuff that gonna work properly please……….

    thank you…

  4. wwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwww

  5. Wow. Simple and works fine.

    Thanks a lot

  6. Nice and gud ……… ur code is working ……
    thanksssssss

  7. Could this script to change alexa rank ?

Wrap your code in <pre class="{language}"></pre> tags, link to a GitHub gist, JSFiddle fiddle, or CodePen pen to embed!

Recently on David Walsh Blog

  • Get Node.js Command Line Arguments with yargs

    Using command line arguments within Node.js apps is par for the course, especially when you're like me and you use JavaScript to code tasks (instead of bash scripts).  Node.js provides process.argv but that doesn't provide a key: value object like you'd expect: Bleh.  If you want to work with a...

  • OâReilly Velocity Conference â New York

    My favorite front-end conference has always been O'Reilly's Velocity Conference because the conference series has focused on one of the most undervalued parts of client side coding:  speed.  So often we're so excited that our JavaScript works that we forget that speed, efficiency, and performance are just as important. The next Velocity...

  • Free Download: Font Bundle Featuring 17 Incredible Typefaces

    The only thing we love more than a good font, is a good free font. So we’ve combed the Web for some of our favorite free fonts, and gathered them here in a single download. You’ll find a variety of useful typefaces, from highly geometric designs...

  • OâReilly Velocity Conference â Amsterdam

    My favorite front-end conference has always been O'Reilly's Velocity Conference because the conference series has focused on one of the most undervalued parts of client side coding:  speed.  So often we're so excited that our JavaScript works that we forget that speed, efficiency, and performance are just as important. The next Velocity...

  • CanIUse Command Line

    Every front-end developer should be well acquainted with CanIUse, the website that lets you view browser support for browser features.  When people criticize my blog posts for not detailing browser support for features within the post, I tell them to check CanIUse:  always up to date, unlike...