Is there a way to use JQuery to redirect to a specific URL after a give time period?
-
You should accept the correct answer...Legionar– Legionar2015-06-10 12:06:08 +00:00Commented Jun 10, 2015 at 12:06
-
If you want cross-browser and seo support: redirect generatorPatartics Milán– Patartics Milán2016-10-16 12:43:36 +00:00Commented Oct 16, 2016 at 12:43
Add a comment
|
9 Answers
You could use the setTimeout() function:
// Your delay in milliseconds
var delay = 1000;
setTimeout(function(){ window.location = URL; }, delay);
Comments
You don't really need jQuery for this. You could do it with plain javascript using the setTimeout method:
// redirect to google after 5 seconds
window.setTimeout(function() {
window.location.href = 'http://www.google.com';
}, 5000);
Comments
$(document).ready(function() {
window.setInterval(function() {
var timeLeft = $("#timeLeft").html();
if(eval(timeLeft) == 0) {
window.location= ("http://www.technicalkeeda.com");
} else {
$("#timeLeft").html(eval(timeLeft)- eval(1));
}
}, 1000);
});
2 Comments
winhowes
I would discourage the use of
eval() as it has many dangerous consequences. Instead I would recommend using parseInt().
nickornotto
The only problem with this is that if the redirect doesn't happen quickly it keeps redirecting and never gets to the target page
You can use
$(document).ready(function(){
setTimeout(function() {
window.location.href = "http://test.example.com/;"
}, 5000);
});
Comments
just use:
setTimeout("window.location.href='yoururl';",4000);
..where the '4000' is m.second
Comments
Yes, the solution is to use setTimeout, like this:
var delay = 10000;
var url = "https://stackoverflow.com";
var timeoutID = setTimeout(function() {
window.location.href = url;
}, delay);
note that the result was stored into timeoutID. If, for whatever reason you need to cancel the order, you just need to call
clearTimeout(timeoutID);
Comments
I have made a simple demo that prompts for X number of seconds and redirects to set url. If you don't want to wait until the end of the count, just click on the counter to redirect with no time. Simple counter that will count down while pulsing time in the midle of the page. You can run it onclick or while some page is loaded.
I also made github repo for this: https://github.com/GlupiJas/redirect-counter-plugin
JS CODE EXAMPLE:
// FUNCTION CODE
function gjCountAndRedirect(secounds, url)
{
$('#gj-counter-num').text(secounds);
$('#gj-counter-box').show();
var interval = setInterval(function()
{
secounds = secounds - 1;
$('#gj-counter-num').text(secounds);
if(secounds == 0)
{
clearInterval(interval);
window.location = url;
$('#gj-counter-box').hide();
}
}, 1000);
$('#gj-counter-box').click(function() //comment it out -if you dont want to allo count skipping
{
clearInterval(interval);
window.location = url;
});
}
// USE EXAMPLE
$(document).ready(function() {
//var
var gjCountAndRedirectStatus = false; //prevent from seting multiple Interval
//call
$('h1').click(function(){
if(gjCountAndRedirectStatus == false)
{
gjCountAndRedirect(10, document.URL);
gjCountAndRedirectStatus = true;
}
});
});
Comments
Use setTimeout function with either of the following
// simulates similar behavior as an HTTP redirect
window.location.replace("http://www.google.com");
// simulates similar behavior as clicking on a link
window.location.href = "http://www.google.com";
setTimeout(function(){
window.location.replace("http://www.google.com");
}, 1000)
This is improved @Vicky solution - it has clearInterval() added so it prevents a loop of reloading if the redirect takes too long:
$(document).ready(function () {
var myTimer = window.setInterval(function () {
var timeLeft = $("#countdown").html();
if (eval(timeLeft) == 0) {
console.log('Now redirecting');
clearInterval(myTimer);
window.location = ("@Html.Raw(HttpUtility.HtmlDecode(redirectUrl))");
} else {
$("#countdown").html(eval(timeLeft) - eval(1));
}
}, 1000);
});
