Случайный порядок в классе

Question

Как было предложено многими, я принял их совет и реформировал мой вопрос. Я достал много кода и теперь показываю минимальный минимум. Надеюсь, этого достаточно и достаточно ясно, чтобы снова открыть мой вопрос.

У меня есть следующая скрипка: http://jsfiddle.net/mauricederegt/vNpYe/5/

со следующим HTML:

<div id="main" tabindex="1"> 
      <div class="tile tile1" block-id="1" style-id="1" style="left:0px; top:0px"></div> 
      <div class="tile tile3" block-id="2" style-id="2" style="left:100px; top:0px"></div> 
      <div class="tile tile1" block-id="3" style-id="1" style="left:200px; top:0px"></div> 
      <div class="tile tile2" block-id="4" style-id="2" style="left:350px; top:0px"></div> 
      <div class="tile tile2" block-id="5" style-id="2" style="left:0px; top:100px"></div> 
      <div class="tile tile1" block-id="6" style-id="1" style="left:100px; top:100px"></div> 
</div> 

Я пытаюсь рандомизации порядок выключения классе Div в. Так что только часть class: class="tile tile1", все остальные элементы div должны оставаться такими, как есть.

Пример: код может выглядеть следующим образом после рандомизации (обратите внимание, что только class перемешивается):

<div id="main" tabindex="1"> 
       <div class="tile tile3" block-id="1" style-id="1" style="left:0px; top:0px"></div> 
       <div class="tile tile2" block-id="2" style-id="2" style="left:100px; top:0px"></div> 
       <div class="tile tile1" block-id="3" style-id="1" style="left:200px; top:0px"></div> 
       <div class="tile tile2" block-id="4" style-id="2" style="left:350px; top:0px"></div> 
       <div class="tile tile1" block-id="5" style-id="2" style="left:0px; top:100px"></div> 
       <div class="tile tile1" block-id="6" style-id="1" style="left:100px; top:100px"></div> 
    </div> 

Как я могу получить классы в Div для отображения в случайном порядке?

Надеюсь, теперь вопрос более ясен.

Большое спасибо

Answer 1

Во-первых, вам нужен массив классов плитки.

var tiles = [], 
tile_re = /tile(\d+)/; 

$('.tile').each(function(i) { 
    tiles[i] = this.className.match(tile_re)[0]; 
}); 

Затем нужно перетасовать массив классов:

function shuffle(a) 
{ 
    var t; 

    for (var i = a.length - 1; i > 0; --i) { 
    var p = Math.floor(Math.random() * (i + 1)); 
    if (p !== i) { 
     t = a[i]; 
     a[i] = a[p]; 
     a[p] = t; 
    } 
    } 
} 

shuffle(tiles); 

Наконец, вы сливаться результаты обратно:

$('.tile').each(function(i) { 
    this.className = 'tile ' + tiles[i]; 
});