はボタンが現在

Question

を出て行くようにする方法を見つける必要があり、私はそれが仕事だと15までカウントダウンん15.

<div id="skip" style="margin-top: 4px;"> 
      <p> Please wait for <span id="timer" style="font-weight:bold;">15</span> seconds</p> 
     </div> 

<div id="button"> 
     <form action="http://website.com"> 
    <input type="submit" style="display: none;" value="Go to website"/> 

    <script> 
    var count = 15; 

    function countDown(){ 
     var timer = document.getElementById("timer"); 
     if(count > 0){ 
      count--; 
      timer.innerHTML = count; 
      setTimeout("countDown()", 1000); 
     }else{ 
      document.getElementById("button"); 

     } 
    } 
    countDown(); 
    </script> 

までカウントダウンカウントダウンスクリプトを持っています。私が実際にやりたいことは、15秒が過ぎると、代わりに "Go to website"というボタンが表示されるということです。

基本的には他のショートパンダに似ていますが、そうではありません。

document.getElementByID does not workとは思えません。私は、ボタンを表示させる方法を探していましたが、機能しません。

Answer 1

ボタンを非表示にして、タイマーの期限が切れるとその状態を解除します。これを行う一般的な方法は、以下に示すように、「隠された」ユーティリティクラスを使用することです。

注：このスニペットでのカウントは3回です。なぜなら、各反復が15秒間待っているから退屈だからです。 :)

var count = 3; 
 

 
function countDown(){ 
 
    var timer = document.getElementById("timer"); 
 
    var button; 
 
    var skipContainer; 
 
    if(count > 0){ 
 
    count--; 
 
    timer.innerHTML = count; 
 
    setTimeout("countDown()", 1000); 
 
    }else{ 
 
    skipContainer = document.getElementById("skip"); 
 
    button = document.getElementById("button"); 
 
    skipContainer.classList.add("hidden"); 
 
    button.classList.remove("hidden"); 
 
    } 
 
} 
 
countDown();

.hidden { 
 
    display: none; 
 
}

<div id="skip" style="margin-top: 4px;"> 
 
    <p> Please wait for <span id="timer" style="font-weight:bold;">15</span> seconds</p> 
 
</div> 
 

 
<div id="button" class="hidden"> 
 
    <form action="http://website.com"> 
 
    <input type="submit" value="Go to website"/> 
 
    </form> 
 
</div>

Answer 2

あなたは、私がカウントダウンプロセスのために、より自然だと思うのsetInterval（）関数を使用することができます。私は@パルティムの回答からほとんどのコードを再利用します。

var count = 3; 
 

 
var myVar = setInterval(function(){ countDown() }, 1000); 
 

 
function countDown() { 
 
    var timer = document.getElementById("timer"); 
 
    var button; 
 
    var skipContainer; 
 
    if(count > 0){ 
 
    count--; 
 
    timer.innerHTML = count;  
 
    }else{ 
 
    myStopFunction(); 
 
    skipContainer = document.getElementById("skip"); 
 
    button = document.getElementById("button"); 
 
    skipContainer.classList.add("hidden"); 
 
    button.classList.remove("hidden"); 
 
    } 
 
} 
 

 
function myStopFunction() { 
 
    clearInterval(myVar); 
 
}

.hidden { 
 
    display: none; 
 
}

<div id="skip" style="margin-top: 4px;"> 
 
    <p> Please wait for <span id="timer" style="font-weight:bold;">15</span> seconds</p> 
 
</div> 
 

 
<div id="button" class="hidden"> 
 
    <form action="http://website.com"> 
 
    <input type="submit" value="Go to website"/> 
 
    </form> 
 
</div>