Как сделать JavaScript Math.random Repeat? - PullRequest
0 голосов
/ 29 октября 2010

в основном у меня есть страница на моем сайте с полями, которые скользят, чтобы показать цвет фона. Я хочу, чтобы этот цвет фона был случайным при загрузке страницы путем добавления класса к элементу, например .blue, .green и т. Д. *

Я создал этот код, и, как вы можете заметить, он случайным образом сортирует класс цвета и применяется к элементу, это работает для первых 6 элементов, однако на этой странице, в частности, 12 элементов, к которым я хочу применить это, поэтому мой вопрос Как я могу применить случайный выбор переменных классов для всех ".portfolio ul li a"? Нужно ли иметь какую-то форму повторения?

Это мой сценарий ..

function randCol() {
return (Math.round(Math.random())*7); }

$(document).ready(function() {
var classes = [ 'blue', 'orange', 'green', 'pink', 'black', 'white'];
classes.sort( randCol );
$('.portfolio ul li a').each(function(i, val) {
    $(this).addClass(classes[i]);
});

})

Это моя структура исходного кода

<div class="portfolio">
<ul>
    <li>
       <a href="#">
         <img src="images/content/portfolio/sample1.png" height="175" width="294" alt="sample" class="front" />
         Text for behind the image                         
       </a>
    </li>


Ответы [ 2 ]

3 голосов
/ 29 октября 2010

Ваша функция сравнения randCol () на самом деле не работает. Во-первых, такая функция должна возвращать 1, -1 или 0 в зависимости от того, является ли первый член сравнения большим, меньшим или равным (соответственно) второму члену.

Во-вторых, код, который вы там используете, по-видимому, предназначен для ссылки на ваш 6-элементный массив, но, как написано, он может возвращать значения до 7, что на 2 больше, чем последний индекс массива. Лучше выполнить поиск по литералу функции each (), например:

$(document).ready(function() {
var classes = [ 'blue', 'orange', 'green', 'pink', 'black', 'white'];

$('.portfolio ul li a').each(function(i, val) {
    var index = Math.floor(Math.random()*6); // highest value will be 5, lowest will be 0
    $(this).addClass(classes[index]);
});
0 голосов
/ 29 октября 2010

приведенный выше ответ может привести к повторению ошибок. Я думаю, что это можно исправить :)

$(document).ready(function() {
var classes = [ 'blue', 'orange', 'green', 'pink', 'black', 'white'];
var temp=0;
$('.portfolio ul li a').each(function(i, val) {
    if(temp==0){
    var index = Math.floor(Math.random()*6);}
    else{ 
    var index = Math.floor(Math.random()*6);
    index=temp+index;
    temp=index;}
});
...