forループの配列内容を表示する

Question

randomTableから1つの数字を8秒間、1by1で表示しようとしています。残念ながら、何も表示していません。

var numberTable = []; 
    var randomTable = []; 

    $('#pooling').append('<div id="box"> </div>'); 

    for (var i=1;i<=32;i++) { 
     numberTable.push(i); 
    } 

    for (var i=0;i<8;i++) { 
     (function (e) { 
      randomTable.push(1 + Math.floor(Math.random() * (32 - e))); 
      numberTable.splice(e,1); 
      $('#box').replaceWith('<div id = "box>' + randomTable[e] + '</div>'); 
      $('#box').show(0).delay(8000).hide(0); 
     })(i); 
    } 

私は2回目のfor-loopを削除すると空の#boxを表示しますが、このループではこのdivはまったく作成されません。何が問題なの？

Answer 1

それはあなたの意図が何であるかを正確に明確ではないですが、多分これは役立ちます：

var numberTable = []; 
 
var randomTable = []; 
 
for (var i = 1; i <= 32; i++) { 
 
    numberTable.push(i); 
 
} 
 
for (var i = 0; i < 8; i++) { 
 
    randomTable.push(1 + Math.floor(Math.random() * (32 - i))); 
 
    numberTable.splice(i, 1); 
 
} 
 
console.log("randomTable: " + randomTable); 
 

 
$('#box').text(randomTable[0]); 
 
var x = 1; 
 
function repeat(){ 
 
    window.setTimeout(function(){ 
 
    if (x < 8) { 
 
     $('#box').text(randomTable[x]); 
 
     x++; 
 
     repeat(); 
 
    } 
 
    },8000); 
 
}; 
 
repeat();

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<p id="box"></p>

Answer 2

最初に - replaceWithコールには"がありません。

秒 - あなたはAPPENDを使用して、このようにIDをサフィックスこと - あなたはreplaceWithを使用して各反復でそれを上書きして、あなたは常に一つだけのdiv（ID =箱）で終わる必要があり、このアプローチを使用して：

$('#box').append('<div id="box-' + e '">' + randomTable[e] + '</div>')

のいずれかを使用するか、idのままにしておき、代わりに名前を含めるクラスを使用してください。文書内に同じIDを持つ要素が1つだけ存在する必要があります。

あなたのhtmlマークアップの願いをお伝えください。