2017-05-26 9 views
0

この質問を完了するためにいくつかの助けを捜していたがっていました。JS関数。時間間隔でメッセージを記録します

は、メッセージパラメータをコンソールに(Number Parameter)ごとに記録します。このシーケンスを開始および停止するHTMLボタンを実装します。

私はこれまでこれを得ることができました。

var displayLog = function Container(param) { 

     var message = 'any string'; // Local message variable 
     var timeCount = "10"; // Local time count variable 

     setInterval(function getLoggeddemo(message,timeCount) { 
     console.log(message); 
     return getLoggeddemo; 
     }(), timeCount); 
    } 

ボタンが開始&ストップの間でトグルされるときの質問は、すべての(X)秒のメッセージを表示するように求めています。私は現在、HTMLボタンでシーケンスを開始および停止するif/elseステートメントを含める方法を理解しようとしています。

+0

のsetIntervalとてclearInterval(これはログを停止します)。 – vabii

+0

よろしくお願いします。clearInterval(function(){})のように設定した後に間隔をクリアする関数を配置する必要がありますか? – khalebrucht22

+0

また、htmlボタンでこれを開始および停止する方法を知っていますか?if/elseステートメント権利?質問に応じて正しい道にいることを確認したい – khalebrucht22

答えて

1

いくつかの問題:

  • あなたはsetIntervalにに渡したい関数を呼び出してはいけない:その関数本体の後に括弧を削除します。

  • displayLogとは決して電話していないようです。

  • timeCountは、文字列ではなく数字であると想定されます。これは、間隔が終了するミリ秒数です。

  • インターバルロジックのボタンクリックの影響はありません。

  • setIntervalコールバックで何かを返すことは意味を持ちません。引数はそのコールバックには提供されません。これらのパラメータを削除します。

私はイベントリスナーを追加/削除しないことをお勧めしますが、あなたがしている状態を示すブール変数を使用し、そのに応じて1つに適切なアクションを実行するために、シングルクリックハンドラ:

var i = 0; 
 
var displayLog = function Container(message) { 
 
    console.log(i++, message); 
 
    // Return the id of the interval 
 
    return setInterval(function getLoggeddemo() { // no arguments here 
 
     console.log(i++, message); 
 
    }, 1000); // Every second 
 
} 
 

 
var mixBut = document.getElementById("mixBut"); 
 
var interval = null; 
 
mixBut.addEventListener("click", toggle); 
 

 
function toggle(){ 
 
    if (interval === null) { 
 
     mixBut.value = "Stop"; 
 
     interval = displayLog("Hi there!"); 
 
    } else { 
 
     mixBut.value = "Start"; 
 
     clearInterval(interval); 
 
     interval = null; 
 
    } 
 
}
<button id="mixBut">Mix</button>