如果用戶贏得遊戲，停止倒數計時器

我正在研究一個涉及倒數計時器的兒童遊戲。如果用戶在計時器用完之前匹配所有元素，則顯示「You Won！」彈出窗口。如果它們在定時器命中零之前不匹配所有元素，則會顯示「Sorry，You Lost」彈出窗口。如果用戶贏得遊戲，停止倒數計時器

我遇到的問題是在用戶贏得遊戲和「你贏了！」之後時鐘不停止倒計時。彈出窗口出現，所以一旦定時器到達零，「Sorry，You Lost」彈出窗口仍會出現。

這裏是我的代碼：

$("#startClock").click(function(){ 
    var timer; 
    var counter = 4; 
    var winner = 0; 
    var done = true; 

    $("#boat").draggable({ 
    revert: "invalid", containment: "#wrapper", 
    start: function(event, ui){ 
     if(!done) return false; 
    }, 
    stop: function(event, ui){ 
     if($(".correct").length == $(".drop").length){ 
      setTimeout(function(){ 
       $("<div title='You did it!'>You won!</div>").dialog(); 
      },500); 
      var winner = 1; 
     } 
    } 
    }); 

    if(!timer){ 
     timer = setInterval(function() { 
     counter--; 
     if (counter >= 0) { 
      span = document.getElementById("count"); 
      span.innerHTML = counter; 
     } 
     if (counter === 0 && winner === 0) { 
      $("<div title='Game Over'>Sorry, game over!</div>").dialog(); 
      clearInterval(counter); 
     } 
     }, 1000); 
    } 
});

View my demo game here.（點擊右上角的「啓動時鐘」）任何幫助表示讚賞。謝謝！

勞倫

來源

2014-03-03 Lauren

也許......否則，如果 – Dan

您需要在setTimeout的引用上調用clearInterval（）。

var timer; 
    $("#startClock").click(function(){ 
     var counter = 60; 
     if(!timer){ 
      timer = setInterval(function() { 
     counter--; 
      if (counter >= 0) { 
      span = document.getElementById("count"); 
      span.innerHTML = counter; 
      } 
      if (counter === 0) { 
      $("Sorry, you lost!").dialog(); 
      clearInterval(timer); 
      } 
     }, 1000); 
     } 
    });

當用戶贏得遊戲時，還要添加對clearInterval（timer）的調用，但首先檢查是否定義了定時器。

來源

2014-03-03 23:05:52

我很感謝幫助！我剛剛在我的初始文章中更新了我的代碼，以及我發佈的演示遊戲中的代碼。當用戶贏得遊戲時，我仍然遇到讓時鐘停止的問題。我是這個初學者，我確信我錯過了一些顯而易見的事情，但是我會感激所有進一步的幫助。謝謝！ – Lauren

您需要使用定時器clearInterval（timer）的引用來調用clearInterval。 –

嗨@勞雷恩我試過頁面，當你贏了，當你贏了，計時器停止，這似乎是好的o.o –

我沒有看到玩家獲勝時的代碼，但是你需要明確地停止計數器付款人勝時。其他如果能爲此工作。

來源

2014-03-03 22:51:25 Souleythemane

完成此操作的最簡單方法可能只是爲您的第二個條件添加&&以檢查玩家是否贏得了比賽。編輯 - 如果玩家贏了，還可以添加一個清除計時器。

if (counter === 0 && /*check if player has not won*/) { 
    $("Sorry, you lost!").dialog(); 
    clearInterval(counter); 
} 
else if (/*if player has won*/) { 
    clearInterval(counter);

這樣，只有在定時器用完而他們還沒有贏的情況下，'遺失你輸'信息纔會出現。如果你還沒有這樣做，你可以創建一個變量，如果玩家獲勝並且在上述條件的後半部分檢查該變量的值，則該變量會發生變化。

來源

2014-03-03 22:55:43 cerpintaxt

我試着實現以下，但它只是防止「你失去了」彈出窗口出現。有任何想法嗎？ 'if（counter === 0 && document.getElementByID（「goodJob」）.css（「display」，「block」））' – Lauren

對不起，我認爲主要目標是防止彈出，但如果您還添加了其他條件，您可以在有人獲勝時停止定時器。我將編輯上面的代碼來顯示。愛德華多也有上面的寫作想法。 – cerpintaxt

哦，你想知道如何檢查一個球員是否也贏了。如果您發佈的代碼顯示您的代碼如何顯示「您贏」的文字，我可以幫助您弄清楚。但基本上你想要設置一個變量'playerWon'爲0，然後在玩家獲勝時將其更改爲1。那麼上面的條件就是'if（counter === 0 && playerWon === 0）'。合理？ – cerpintaxt

如果用戶贏得遊戲，停止倒數計時器

回答

相關問題