3

一部のアニメーション (私はゲームを行っています) に javascript の setIterval を使用するクリック イベントで実行される関数があるため、問題は、アニメーションがまだ表示されている間にユーザーがクリックした場合 (setInterval はまだ実行中)、setIntervalイベントスタックに積み上げられているか、それが私が見つけたものであるため、ゲームがクラッシュするか、2 倍の速さで実行されます (アニメーション)。私の質問は、イベントのスタックを防ぐ方法はありますか? setInterval を前の setInterval などに積み上げたくありません。次のように clearInterval 関数を使用できることを知っています。

  var timerInterval = setInterval(drawPlayerRunning, 50);
  clearInterval(timerInterval);

しかし、関数がまだ実行されている間にユーザーが何度もクリックすると、clearIntervalはイベントスタックの最後のイベントのみを取り除き、以前のイベントはすべて「ゲーム」に残るため、私が望むようには実際には機能しません"。このイベントのスタックを防ぐ方法、または少なくともそれらを効率的に削除する方法はありますか?

4

2 に答える 2

3

間隔の状態を監視するフラグを作成できます: 1)

var isIntervalInProgress = false;
setInterval(function()
{
  if ( isIntervalInProgress )
    return false;

  isIntervalInProgress = true;

  drawPlayerRunning();

  isIntervalInProgress = false;

}, 50);

または、終了後に自動的に実行されるタイムアウト: 2)

var func = function()
{
  setTimeout(function()
  {
    drawPlayerRunning();
    func();
  }, 50)
}

好きな方

于 2012-11-12T18:47:08.843 に答える
0

requestAnimationFrameを使用したい。ゲームを念頭に置いて設計されており、コードが遅すぎる場合は、それに応じてフレーム レートが低下します (たとえば、60 fps から 30 fps に)。しかし、それはイベントを積み重ねません。

編集：申し訳ありませんが、私はあなたの質問を誤解したと思います. もう一度試してみましょう。

数ミリ秒ごとに呼び出される関数は1 つだけにする必要がありdrawます (間隔は で設定しますrequestAnimationFrame(draw))。

クリックで新しい間隔を追加するのではなく、オブジェクトを作成しfloatingAnimationてレンダリングするオブジェクトのリストに追加する必要があります。すべてのアニメーション オブジェクトはdraw、ブラウザが を呼び出すたびに関数によってレンダリングされますdraw。に渡される引数にはdraw、タイムスタンプがあります。このタイムスタンプから の作成日を差し引いたものを使用してfloatingAnimation、キャラクターの上に浮いているものを描画する方法を決定します。

于 2012-11-12T18:50:19.263 に答える