需要在整個頁面使用javascript的隨機和獨特的數字

我使用javascript來包裝圖像在我的網頁上，但我想分配每個圖像的唯一，但隨機的類名稱。下面的代碼指定了一個隨機的類名，但是它爲每個圖像分配了SAME類的名稱。我如何更改我的代碼以允許每個圖像具有唯一但隨機的類名？需要在整個頁面使用javascript的隨機和獨特的數字

var randomnumber=Math.floor(Math.random()*10) 

var bphotorightnomargin = document.getElementsByClassName("body-photo alignright no-margin-left"); 
$(bphotorightnomargin).toggleClass("body-photo alignright no-margin-left").wrap("<div class='body-photo-wrap body-photo-" + randomnumber + " alignright no-margin-left'></div>");

來源

2016-02-29 InfernalRed

是否真的要*隨機*？您可以保留一個計數器並將計數附加到每個ID，然後每次增加計數。 – Pointy

然後多次調用random（）函數，每個圖像一次。你還沒有顯示任何其他代碼，但我敢打賭，你只能生成一個號碼，然後重複使用你存儲該號碼的變量一遍又一遍。並注意你很可能很快就會碰到碰撞，特別是如果你有2個或更多的圖像，並且只產生一個1-> 10之間的數字。 –

爲什麼你需要一個隨機課？你打算如何使用這個類來做任何有用的事情。 – adeneo

看起來像你正在重複使用你設置隨機數的相同變量。裹在一個函數，並調用函數：

function getRandomNumber() { 
    return Math.floor(Math.random()*10); 
}

，那麼你可以這樣做：

$(bphotorightnomargin).each(function() { 
    $(this).toggleClass("body-photo alignright no-margin-left") 
    .wrap("<div class='body-photo-wrap body-photo-" 
    + getRandomNumber() 
    + " alignright no-margin-left'></div>"); 
});

通知我加.each，這將通過你的HTML元素的列表迭代，運用獨特的每個班級。

但仍然有相同數字會出現多次的機會。就像你可能得到5次，3次一樣。您可以將已經擁有的數字存儲在數組中，並檢查以確保該數字不會再次出現。

var existingNumbers = []; 

function getRandomNumber() { 
    var randomNum = Math.floor(Math.random()*10); 
    while(!isUnique(randomNum)) { 
    randomNum = Math.floor(Math.random()*10); 
    } 
    existingNumbers.push(randomNum); 
    return randomNum; 
} 

function isUnique(number) { 
    var length = existingNumbers.length; 
    for(var i = 0; i < length; i++) { 
    if(number === existingNumbers[i]) { 
     return false; 
    } 
    } 
    return true; 
}

來源

2016-02-29 18:58:05

這工作完美！非常感謝。 – InfernalRed

下面是對您的代碼的一個非常簡單的調整。根據需要調整類。

var randomnumber=Math.floor(Math.random()*10) 

var imageArray = document.getElementsByClassName("class-a"); 
$.each(imageArray, function(index,value){ 
    $(value).wrap("<div class='class-b " + (randomnumber + index) + " class-c'></div>") 
});

DEMO

來源

2016-02-29 19:05:13

需要在整個頁面使用javascript的隨機和獨特的數字

回答

相關問題