In this short JavaScript tutorial, we’ll show how to redirect page after some specified time. Means, page redirect will delay for some specified times. Sometimes you needed to display some message to the users before redirecting to the another page. You don’t need to use jQuery for doing it, using JavaScript you can easily implement this functionality.<\/p>\n
In our example script, we’ll display a button and clicking on this button the message would be shown with a countdown (redirect timer) and the page would be redirected after 5 seconds. Let’s start redirect page after delay using JavaScript tutorial.<\/p>\n
The message and countdown are displays in In this short JavaScript tutorial, we’ll show how to redirect page after some specified time. Means, page redirect will delay for some specified times. Sometimes you needed to display some message to the users before <\/p>\n","protected":false},"author":1,"featured_media":1249,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_jetpack_memberships_contains_paid_content":false,"footnotes":"","jetpack_publicize_message":"","jetpack_publicize_feature_enabled":true,"jetpack_social_post_already_shared":true,"jetpack_social_options":{"image_generator_settings":{"template":"highway","default_image_id":0,"font":"","enabled":false},"version":2}},"categories":[10],"tags":[135,66,136,80],"class_list":["post-1248","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-javascript","tag-countdown","tag-javascript","tag-setinterval","tag-url-redirect","cat-10-id","has_thumb"],"yoast_head":"\ndelayRedirect()<\/code> function would be called on button click. At first, we’ll display the message with delay times. After that, we’ll use JavaScript setInterval()<\/code> method to evaluate an expression at specified intervals. Once the count<\/code> variable is reached 0, the user would be redirected.<\/p>\n<script<\/span>>\r\nfunction<\/span> delayRedirect<\/span>(){\r\n document<\/span>.getElementById<\/span>('delayMsg'<\/span>).innerHTML =<\/span> 'Please wait you\\'<\/span>ll be redirected after <span id=\"countDown\">5<\/span> seconds....'<\/span>;\r\n var<\/span> count =<\/span> 5<\/span>;\r\n setInterval<\/span>(function<\/span>(){\r\n count--<\/span>;\r\n document<\/span>.getElementById<\/span>('countDown'<\/span>).innerHTML =<\/span> count;\r\n if<\/span> (count ==<\/span> 0<\/span>) {\r\n window<\/span>.location<\/span> =<\/span> 'https:\/\/www.google.com'<\/span>; \r\n }\r\n },1000<\/span>);\r\n}\r\n<\/script<\/span>>\r\n<\/pre>\nHTML<\/h2>\n
delayMsg<\/code> div. delayRedirect()<\/code> function is invoked when Click to Redirect is clicked.<\/p>\n<div<\/span> id<\/span>=<\/span>\"delayMsg\"<\/span>><\/div<\/span>>\r\n<input<\/span> type<\/span>=\"button\"<\/span> onclick<\/span>=\"delayRedirect()\"<\/span> value<\/span>=\"Click to Redirect\"<\/span>\/>\r\n<\/pre>\n","protected":false},"excerpt":{"rendered":"