Ump McCollum
Ump McCollum

Reputation: 3

JQuery/Javascript - Redirect to previous page when countdown reaches zero?

This is my first question and i'm fairly new to JS. Anyway, i found this countdown timer on JSFiddle ( http://jsfiddle.net/gPrwW/395/ )and i was wondering what edits need to be made to redirect to the previous page after the timer gets to zero? Thanks for the help!

$(document).ready(function(e) {
  var $worked = $("#worked");

  function update() {

    var myTime = $worked.html();
    var ss = myTime.split(":");
    var dt = new Date();
    dt.setHours(0);
    dt.setMinutes(ss[0]);
    dt.setSeconds(ss[1]);

    var dt2 = new Date(dt.valueOf() - 1000);
    var temp = dt2.toTimeString().split(" ");
    var ts = temp[0].split(":");

    $worked.html(ts[1] + ":" + ts[2]);
    setTimeout(update, 1000);
  }

  setTimeout(update, 1000);
});

Upvotes: 0

Views: 771

Answers (5)

Jon Laing
Jon Laing

Reputation: 84

So a couple things to note about what's happening in the code you posted. First, you're using a Date object. The documentation for Date can be found here: (https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date). So you could do something where you check if both ts[0] and ts[1] are zero, but they are both strings, and personally, I don't like checking strings like that.

However, Date has two methods called getMinutes() and getSeconds() that both return numbers. So, you could put a check, right before you initialize temp. That might look something like this:

if(dt2.getMinutes() === 0 && dt2.getSeconds() === 0) {
  // do what you want to do at the end of countdown
  return; // return out of the function to stop it from continuing
}

Next, to go to the previous page, use window.history. If you want to go to a completely different page, you can use window.location. The documentation for both is here: https://developer.mozilla.org/en-US/docs/Web/API/Window

I really recommend taking a look at the documentation, not only because there's other cool things you can do, but also it'll get you used to looking at documentation for answers. There's a lot of really helpful information in there.

Upvotes: 0

zaffer
zaffer

Reputation: 446

Try this out :

<html>

<head>
  <script src="https://code.jquery.com/jquery-2.2.3.js" integrity="sha256-laXWtGydpwqJ8JA+X9x2miwmaiKhn8tVmOVEigRNtP4=" crossorigin="anonymous"></script>
  <script>
    $(document).ready(function(e) {
      var $worked = $("#worked");

      function update() {
        var myTime = $worked.html();
        if (myTime == "00:00") {
          window.history.back();
          return;
        }
        var ss = myTime.split(":");
        var dt = new Date();
        dt.setHours(0);
        dt.setMinutes(ss[0]);
        dt.setSeconds(ss[1]);

        var dt2 = new Date(dt.valueOf() - 1000);
        var temp = dt2.toTimeString().split(" ");
        var ts = temp[0].split(":");

        $worked.html(ts[1] + ":" + ts[2]);
        setTimeout(update, 1000);
      }

      setTimeout(update, 1000);
    });
  </script>
</head>

<body>
  <div id="worked">00:10</div>
</body>

</html>

Upvotes: 0

Jakub Rożek
Jakub Rożek

Reputation: 2130

I've just updated your code. Check it out https://jsfiddle.net/gPrwW/397/

Upvotes: 0

GeckoTang
GeckoTang

Reputation: 2785

How about this?

if (ts.join("") === "000000") {
  alert("Zero!")
  //location.href = "https://www.google.co.jp"
} else {
  $worked.html(ts[1] + ":" + ts[2]);
  setTimeout(update, 1000);
}

Upvotes: 0

Raul Rueda
Raul Rueda

Reputation: 740

You can use this ;), will return to the previous page.

    function myReturnFunction() {
        setTimeout(function(){ 
           history.go(-1);
        }, 3000);
    };

Upvotes: 1

Related Questions