2

基本的に 30 秒から 0 までカウントダウンし、0 でホームページにリダイレクトするスクリプトを実装しようとしています。ただし、私のスクリプトは Firefox でのみ機能し、Chrome と Safari では機能しないことに気付きました。これらのブラウザーでは、カウンターは 30 秒で「スタック」したままになり、HTML が更新されることはありませんが、リダイレクトは正常に機能します。私が何か間違ったことをしているのか、それとも setInterval がこの種の正しい方法ではないのかはわかりません。

<script>
   var seconds = 31;
   var counter = setInterval("timer()", 1000);
   function timer() {
        seconds = seconds - 1;
        if (seconds < 0) {
            setTimeout("location.href='http://www.homepage.com';", 100);
            return;
        }
        updateTimer();
   }

   function updateTimer() {
         document.getElementById('timer').innerHTML = "Redirecting in " + " " + seconds + " " +  "seconds";
   }
  </script>

前もって感謝します！

編集:奇妙なことに、私のコード (およびすべてのコード) は JSFiddle で動作していますが、実際にページをレンダリングしているときに HTMLinner の「再描画」に失敗しています。秒はうまく変化しています（コンソールに出力しました）が、変化がレンダリングされていません。

最終編集: この問題は基本的に無効な CSS が原因でした。カウンターは写真の上で実行されていたと思います。スパンを相対的な位置に設定し、z-index を高くし、上部と下部の要素を設定しました。これがブロックではないものに受け入れられるとは思えません。

4

3 に答える 3

4

これが実際のサンプルです：

(function() { // wrapper for locals
  var timer = document.getElementById("timer"),
    seconds = 5,
    counter = setInterval(function() {
      if (--seconds < 1) {
        clearInterval(counter);
        timer.innerHTML = "Redirecting now...";
        setTimeout(function() {
          location.href = 'http://www.homepage.com';
        }, 500);
      } else {
        timer.innerHTML = timer.innerHTML.replace(/\d+/, seconds);
      }
    }, 1000);
})();
<div id="timer">Redirecting in 5 seconds</div>

</p>

于 2012-10-18T17:24:16.317 に答える
0

定義された関数が少ない（デモを使用した）よりクリーンな実装を次に示します。

<span id='timer'></span>
<script>
var seconds = 31;
setInterval(function() {
  seconds = seconds - 1;
  if (seconds < 0) {
    setTimeout(function() {document.getElementById('timer').innerHTML = "redirecting..."}, 100);
    return;
  }
  updateTimer();
}, 1000);

function updateTimer() {
  document.getElementById('timer').innerHTML = "Redirecting in " + + seconds + " seconds";
}
<script>

もちろん、すべてのJavaScriptプログラマーは、文字列をsetIntervalとsetTimeoutに渡すことを含む「evalisevil」を指摘する機会があれば必要です:)

于 2012-10-18T17:21:50.187 に答える
0

あなたの関数を変数に変更してください。

<script>
   var seconds = 31;
   var counter = setInterval(timer, 1000);
   var timer = function() {
        seconds = seconds - 1;
        if (seconds < 0) {
            setTimeout("location.href='http://www.homepage.com';", 100);
            return;
        }
        updateTimer();
   }

   function updateTimer() {
         document.getElementById('timer').innerHTML = "Redirecting in " + " " + seconds + " " +  "seconds";
   }
  </script>
于 2013-10-12T11:53:52.960 に答える