循環瀏覽數組內容有延遲

-1

這是一個jQuery/javascript問題。所以我有一個包含按鈕數字的數組，並將這些按鈕輸出到一個按鈕上，這會導致按鈕被點擊。問題是如果我運行循環，所有按鈕都會立即點擊。相反，我希望它能夠延遲輸出數字，以便在1秒延遲後按下按鈕。循環瀏覽數組內容有延遲

這裏是鏈接到西門遊戲項目： https://codepen.io/roger1891/full/vmYqwx/

問題是繼第一按鈕後可見。之後，計算機將同時按下兩個按鈕，而不是在延遲1秒後分別按下它們。

問題坐落在這個循環中，其位於myloop（）函數：

sequenceArray.forEach(function(item, index, array){ 
    //click button by getting the last index of the array 
    //$("#btn-"+array[array.length-1]).click(); 
    $("#btn-"+array[index]).click(); 

    console.log(array); 
});

這是全碼：

//associating buttons to sound 
    var soundButton = function(buttonId, soundId) { 
    $("#" + buttonId).click(function(){ 
    $("#" + soundId).get(0).play(); 
    $("#" + buttonId).css("opacity", "0.5"); 
    setTimeout(function(){ 
     $("#" + buttonId).css("opacity", "1"); 
    },500); 
    if(currentPlayerTurn == "human") { 
     var $input = $(this); 
     var attrString = $input.attr("id"); 
     //only get number from id attribute 
     var strNum = attrString.replace(/^\D+/g, ''); 
     //convert theNumber from string to number 
     var theNum = parseInt(strNum); 
     playerArray.push(theNum); 
     console.log(theNum); 
     console.log(playerArray); 
    } 
    }); 
    }; 

    function myLoop() { 
    setInterval(function(){ 
     if(gameWon == false && onGoingGame == true && currentPlayerTurn == "computer" && score < 5) { 

     //increment score 
     score++; 
     //append to score id 
     $("#score").empty().append(score); 
     //create random number 
     randomNumber = Math.floor((Math.random()*4) + 1); 
     //push random number into array 
     sequenceArray.push(randomNumber); 
     //loop through array 

     sequenceArray.forEach(function(item, index, array){ 
     //click button by getting the last index of the array 
     //$("#btn-"+array[array.length-1]).click(); 
     $("#btn-"+array[index]).click(); 

     console.log(array); 
     }); 

     currentRound = sequenceArray.length; 
     onGoingGame = false; 
     currentPlayerTurn = "human"; 
     } 

     if(currentPlayerTurn == "human") { 
     var is_same = playerArray.length == sequenceArray.length && playerArray.every(function(element, index) { 
      return element === sequenceArray[index]; 
     }); 
     is_same; 
     console.log(is_same); 
     if(is_same == true) { 
      playerArray = []; 
      onGoingGame = true; 
      currentPlayerTurn = "computer"; 
     } 
     } 
    },1000); 

    } 

myLoop();

預先感謝您的幫助。

來源

2017-04-14 Roger

要調用'forEach'在區間的回調。你現在會發生什麼事情：街道範圍forEach，並且在'setInterval'的每次迭代期間？ – Pineda

@Pineda如果它的計算機轉向我希望它遍歷數組中的內容。但它應該及時重複1秒鐘。 – Roger

如果您可以編輯您的問題以充分說明您遇到的問題，那將是一件好事，[請查看如何提出一個好問題]（https://stackoverflow.com/help/how-to-ask） – Pineda

全陣列。注意索引，因爲這是異步的。

sequenceArray.forEach(function(item, index, array) { 
    // set a timeout so each second one button gets clicked 
    setTimeout((function(index) { 
     // use a closure here so that our index values stay correct. 
     return function() { 
      $("#btn-"+array[index]).click(); 
     }; 
    }(index)), (1000 * index)); 
});

編輯：換下固定1000ms的延遲延遲*指數

來源

2017-04-14 12:20:28 Shilly

因爲要觸發按鈕一個接一個，你setTimeout()應該是內環路您需要console.log(item)代替forEach循環

來源

2017-04-14 12:01:37 Ebuall

循環瀏覽數組內容有延遲

回答

相關問題