divsに画像を無作為に送信

Question

私はhtml5プロジェクトを持っており、jqueryも使用しています。このプロジェクトはソートゲームです。私はこれらの画像のためにシャッフルをしたい。例えば、私は3枚のカードを持っています。私がゲームを始めると、私はこのカードを1-2-3枚注文します。私がこの注文を並べ替えることができたら、私は例2-3-1のような注文をしたいと思う。これを行うための解決策はありますか？

<div id="source1" class="block">1</div> 
<div id="source2" class="block">2</div> 
<div id="source3" class="block">3</div> 
<br> 
<div id="dest1" class="dest">1</div> 
<div id="dest2" class="dest">2</div> 
<div id="dest3" class="dest">3</div> 

これは例です。これらのdivに画像を送信したいと思います。この画像番号に従ってdiv IDも作成します。

Answer 1

あなたはこのようにしないでください理由：

• すべての画像
• は、n番目の画像を設定し、画像（リスト、例えば配列）
• ループのdivをシャッフル取得リストの画像は既にシャッフルされています。
• はあなたが助けn番目の画像

希望に応じてループされたIDのforeachのdivを設定します。

Answer 2

AR-labs.orgで、私たちはランダムな順序で画像をシャッフルしたいと思っていました。これをアーカイブするために、私たちはすべての要素をループした（共有クラスを使用して）すべての画像を収集し、コンテナの内容とランダムに置き換えました。

当社コード：

var persons = document.getElementsByClassName("person"); 
var personNum = persons.length; 
for(var i = 0; i < personNum; i++){ 
    var b = Math.floor(Math.random() * personNum); 
    persons[i].outerHTML = [persons[b].outerHTML, persons[b].outerHTML = persons[i].outerHTML][0]; 
} 

それは（ない最も美しいコード）かなり基本的だが、それは動作します。

jQueryを使用する場合は、DOMアクセスを対応するjQuery関数に置き換えてください。