2016-03-29 10 views
0

はまだジャバスクリプトのハングアップを取得し、私はこれを行う方法がわかりません..私はページ上のエラーや成功メッセージを送信する間隔を使用していますが、いくつかの問題に遭遇してきたのJavascriptてclearInterval

はのは、私は次があるとしましょう:

function setMyInterval(element) { 
    var timer = setInterval(function() { 
     // add some child nodes to element 
     // play with the css 
    }, 20); 
    return timer; 
} 

function callMyInterval() { 
    var parent = document.getElementById("element"); 
    var myIntervalRef; 
    if(!parent.firstChild) { 
     myIntervalRef = setMyInterval(parent); 
    } else { 
     clearInterval(myIntervalRef); 
     while(parent.firstChild) { 
      parent.removeChild(parent.firstChild); 
     } 
     myIntervalRef = setMyInterval(parent); 
    } 
} 

<button onclick="callMyInterval();" >Reset</button> 

私はこの場合には間隔をクリアするだろうか?私は上記のいくつかのバリエーションを試しましたが、成功しませんでした。私は問題がmyIntervalRef関数の以前の呼び出しへの参照を持っていないが、これを修正する方法がわからないためだと思う。

先進的なすべてのおかげで!あなたのコードで

答えて

0

シンプルで、グローバルにアクセス可能な機能として、myIntervalRefを外部に移動します。そうすることで、は他の機能がそれにアクセスしてにアクセスし、変更を加えることができます。

// Moving the function reference outside of the method, so other function can access it. 

var myIntervalRef; 

function setMyInterval(element) { 
    var timer = setInterval(function() { 
     // add some child nodes to element 
     // play with the css 
    }, 20); 
    return timer; 
} 

function callMyInterval() { 
    var parent = document.getElementById("element"); 
    if(!parent.firstChild) { 
     myIntervalRef = setMyInterval(parent); 
    } else { 
     clearInterval(myIntervalRef); 
     while(parent.firstChild) { 
      parent.removeChild(parent.firstChild); 
     } 
     myIntervalRef = setMyInterval(parent); 
    } 
} 

<button onclick="callMyInterval();" >Reset</button> 

これが役立ちます。

+0

ありがとうございます!私は分後にそれを捕まえた。私はそれが感謝を把握した!しかしもう1つの質問ですが、もう一度クリアすることを提案したら、私はそれをあなたの提案よりも4行上にクリアし、その明確なコール以来それを呼び出さなかったので、それは必要ですか? – user1807880

+0

おっと、申し訳ありませんが、私の悪い、上の 'clearInterval()'に気付かなかった。あなたが追加した 'clearInterval()'を単に削除することができると思います。 – yihyang

0

var myIntervalRef; 

あなたの関数のローカル変数であり、それがグローバルにするには、あなたは後続の呼び出しように、関数スコープの外の間隔変数を定義する必要が

1

修正するための最速の方法ですcallMyIntervalには同じインスタンスが参照されます。

callMyIntervalを呼び出すたびに新しい変数インスタンスが参照されるので、前のタイマーの参照を取得しないように、関数のローカルスコープで定義しました。

関連する問題