如何正確實現帶有循環和onclick函數的setInterval？

Question

我學習Javascript，只是試圖了解如何在不同情況下使用setInterval。 現在我遇到了問題，請有人向我解釋錯誤在哪里以及如何正確執行。

問題情況：

我想通過單擊從計數器獲取新坐標並將其記錄下來。 例如，我單擊一個按鈕，控制台向我顯示：2000 ms之后為0，2000 ms 2之后為2000，2000 ms 3之后為1，依此類推。

例如，我們有一個函數可以對坐標進行處理，只需控制台日志就足夠了：

var showUs = function(coordinate){

console.log(coordinate)
}

另一個功能是增加它的計數器：

var increase = function(){

    for(var i = 0; i < 50; i+=1){
       showUs(i);
     }
  }

最后一個是應該顯示帶有間隔的坐標的函數：

somebuttom.onclick = function(){

   setInterval(function(){ increase() }, 2000);
}

Answer 1

剛剛注意到您的更新。 如果您想這樣做，請嘗試以下方法：

演示

var somebutton = document.getElementById('somebutton');

var showUs = function(coordinate){

console.log(coordinate)
}

var increase = function(){
    var i = 0;
    var si = setInterval(function(){
        if(i < 50){
             showUs(i);
             i++;
        }else{
             clearInterval(si);   
        }
    }, 2000);
}

somebutton.onclick = function(){
  increase();
}