Javascript setInterval（）同時執行兩次

我遇到了一個問題，我有一個單獨的setInterval()，但它同時執行兩次。我的代碼從一個div克隆圖像並將其放置在另一個div中。 setInterval()克隆了3倍的圖像，但實際上克隆了6次。當setInterval結束時，我有一個提醒。當第五個克隆被放置並且第六個克隆再次出現時，彈出警報，這意味着第五個克隆是第一個setInterval()的結束，第六個是第二個克隆的結束。但我只需要1 setInterval()就能製造出3個克隆。發生什麼事？Javascript setInterval（）同時執行兩次

HTML：

<div class="inimigo"> 
    <img src="inimigo.png"> 
</div> 

<div class="jogo2"> 

</div>

的jQuery：

$(document).ready(function() { 
    var counter2 = 0; 
    var i = setInterval(function() { 
     var inimigo = $(".inimigo").clone(); 
     $('.jogo2').html(inimigo); 

     counter2++; 
     if(counter2 === 3){ 
      alert("end"); 
      clearInterval(i); 
      counter2 = 0; 
     } 
    }, 200); 
});

來源

2017-06-22 Rui Pascoal

jQuery的沒有一個'setInterval'功能 - 純醇」 JavaScript並 –

@JaromandaX但仍然可以使用 –

你的代碼是將增加3次重複 - setInterval只有一次開始 - 請參閱[這個小提琴的代碼]（https://jsfiddle.net/98pyntmq/） –

我想克隆是造成問題。當您使用html()時，您應該將HTML作爲文本傳遞。

請檢查溶液，（JSFiddle）

$(document).ready(function() { 
    var counter2 = 0; 
    var i = setInterval(function() { 
     var inimigo = $(".inimigo").clone(); 

     // Followin is the fix code 
     $('.jogo2').prepend(inimigo.html()); 
       // or use append to put new content at last 
     //$('.jogo2').append(inimigo.html()); 

     counter2++; 
     if(counter2 === 3){ 
      alert("end"); 
      clearInterval(i); 
      counter2 = 0; 
     } 
    }, 200); 
});

來源

2017-06-22 04:44:07

Javascript setInterval（）同時執行兩次

回答

相關問題