Question

我正在编写的代码计数从30分钟开始缩短。我想让它在5分钟时提示我再延长30分钟。

这是我的代码：

function countdown(minutes) {
var seconds = 60;
var mins = minutes
function tick() {
    //This script expects an element with an ID = "counter". You can change that to what ever you want.
    var counter = document.getElementById("count");
    var current_minutes = mins-1
    seconds--;
    counter.innerHTML = current_minutes.toString() + ":" + (seconds < 10 ? "0" : "") + String(seconds);
    if( seconds > 0 ) {
        setTimeout(tick, 1000);
    } else {
        if(mins > 1){
            countdown(mins-1);
        }
    }
}
tick();
}

我不知道如何继续。我看到的只是插件。我想使用简单的Javascript / JQuery

Answer 1

以你开始的方式，我重新做了一些。

首先是HTML，我们可以将其可视化：

<div id="ele"></div>

<div id="response" class="hidden">
  Would You like to Restart?
  <button id="yes">YES</button>
  <button id="no">NO</button>
</div>

示例的一些CSS：

接下来是Javascript：

    var counter = document.getElementById('ele');
    var resp = document.getElementById('response');
    var yes = document.getElementById('yes');
    var no = document.getElementById('no');

    var sec = 60;
    var min = 30;

    var isPaused = false;

    // Pauses Counter
    yes.addEventListener("click",function(e){
        isPaused = false;
resp.style.display = 'none';
      sec = 60;
      min = 30;
    }, false);

    // Unpauses Counter
    no.addEventListener("click",function(e){
        isPaused = false;
      resp.style.display = 'none';
    }, false);

    // Counter function
    setInterval(function() {    

      if ( !isPaused ) {

        sec = sec - 1;

        if ( sec == 0 ) {
          sec = 60;
          min = min - 1;
        }

        if ( min == 5 && sec == 60 ) {
          resp.style.display = 'block';
          isPaused = true;
        }

        counter.innerHTML = min + ":" + sec;

      }

    },1000)

简单的JQuery Session扩展

1 个答案: