How To Redirect Page After Delay Javascript

How To Redirect Page After Delay Javascript

How To Redirect Page After Delay Javascript

0 Sales

Free

 

In this short JavaScript tutorial, we'll demonstrate how to redirect the page after a specified time. Means, redirecting the page will delay some of the specified times. Sometimes, before redirecting to another page, you needed to display a message to the users. You don't need to use jQuery to do this, you can easily implement this feature using JavaScript.

 

In our example script, we will display a button and, by clicking on this button, the message will be shown with a countdown (redirect timer) and the page will be redirected after 5 seconds. Continue redirecting the site after delay using the JavaScript tutorial.

 

JavaScript

DelayRedirect() would be called by clicking the button. In the first place, we will display the message with delay times. After that, we will use the JavaScript setInterval() method to evaluate the expression at the specified intervals. If the number variable is reached 0, the user will be redirected.

 

<script>

function delayRedirect(){

    document.getElementById('delayMsg').innerHTML = 'Please wait you\'ll be redirected after <span id="countDown">5</span> seconds....';

    var count = 5;

    setInterval(function(){

        count--;

        document.getElementById('countDown').innerHTML = count;

        if (count == 0) {

            window.location = 'https://www.google.com'; 

        }

    },1000);

}

</script>

HTML


 

Text and countdown are shown in delayMsg div. DelayRedirect() function is invoked when the Redirect button is pressed.

 

<div id="delayMsg"></div>

<input type="button" onclick="delayRedirect()" value="Click to Redirect"/>

 

LICENSE OF USE

You can use it for personal or commercial projects. You can't resell it partially or in this form.

PRODUCT INFO

Create Date : May 14, 2020

Updated Date : May 14, 2020

Ratings

Comments : 0

Downloads : 0