隨機添加相同類的div的類

Question

我有幾個div具有相同的類。我想隨機給每個div添加一個（不同的）類，但是在彼此之後沒有重複添加的類。

這裏是我的HTML範例：什麼應該被添加

<div class="sometext"> some text here </div> 
<div class="sometext"> some other text here </div> 
<div class="sometext"> some more text here </div> 
<div class="sometext"> some more text here </div> 
<div class="sometext"> some more text here </div> 

例如CSS：

.addedclass1 {...} 
.addedclass2 {...} 
.addedclass2 {...} 
.addedclass3 {...} 
.addedclass4 {...} 

什麼我喜歡在看到底：

<div class="sometext addedclass3"> some text here </div> 
<div class="sometext addedclass2"> some other text here </div> 
<div class="sometext addedclass4"> some more text here </div> 
<div class="sometext addedclass1"> some more text here </div> 
<div class="sometext addedclass2"> some more text here </div> 

我有一些jquery隨機添加的類，但它允許重複：

$(document).ready(function() { 
    var classes = ['addedclass1', 'addedclass2', 'addedclass3', 'addedclass4']; 

    $('.sometext').each(function(i) { 
     $(this).addClass(
     classes[Math.floor(Math.random()*classes.length)]); 
    }); 
}); 

我很親切任何幫助 - 我是一個該死的初學者:)

Answer 1

我會創建一個臨時數組，每次包含除以前使用的類以外的所有類的元素。然後從中選擇一個隨機的。

JS小提琴：http://jsfiddle.net/9AbRQ/

var classes = ['addedclass1', 'addedclass2', 'addedclass3', 'addedclass4']; 
var prevClass = ""; 
$('.sometext').each(function() { 
    var classes2 = []; 
    for (var i = 0; i < classes.length; i++) { 
     if (classes[i] !== prevClass) { 
      classes2.push(classes[i]); 
     } 
    } 
    $(this).addClass(prevClass = classes2[Math.floor(Math.random()*classes2.length)]); 
}); 

Answer 2

我只想從數組刪除類使用後它，所以它不能被再次使用，隨機數會更小。如果你需要該數組作爲別的東西，只需創建一個副本來做到這一點。

Answer 3

這將幫助你肯定的，鏡頭，但有效：

$(function(){ 
    $(".sometext").each(function(){ 
     $(this).addClass("addedclass" + (Math.round(Math.random()*100 % $(".sometext").length) + 1)); 
    }); 
}); 

的jsfiddle：http://jsfiddle.net/ashishanexpert/565ZC/1/

或者，如果你想隨意添加類從陣列，你可以這樣做：

$(function(){ 
    var classList = ["addedclass1", "addedclass2", "addedclass3", "addedclass4"]; 

    $(".sometext").each(function(){ 
     $(this).addClass(classList[Math.round(Math.random()*100 % (classList.length - 1))]); 
    }); 
}); 

的jsfiddle：http://jsfiddle.net/ashishanexpert/565ZC/4/

Answer 4

這隻會得到一個隨機指數，直到它從上次使用的一個不同。

$(document).ready(function() { 

    var classes = ['addedclass1', 'addedclass2', 'addedclass3', 'addedclass4'], 
     lastIndex = -1; 

    $('.sometext').each(function(i) { 
     var index; 

     do { 
      index = Math.floor(Math.random()/(classes.length- 1) * 10); 
     } while(index === lastIndex); 

     lastIndex = index; 

     $(this).addClass(classes[index]); 

    }); 

});