0

私はこのようなjQueryでいくつか<li>を追加しています:<div>

countBlocs = 60;
for (i = 1; i <= countBlocs; i++)
{
    $('#head #lol').append("<li id='losange"+ i++ +"' class='losange'></li>");
};

html では次のようになります。

<section id='head'>
    <article id='head_content'>
        <li id='losange1' class='losange'></li>
        <li id='losange2' class='losange'></li>
        <li id='losange3' class='losange'></li>
        <li id='losange4' class='losange'></li>
        <li id='losange5' class='losange'></li>
        <li id='losange6' class='losange'></li>
        ...
    </article>
</section>

そして今、私は<li>jQuery のそれぞれにランダムにクラスを追加しようとしています:

countBlocs = 60;
for (i = 1; i <= countBlocs; i++)
{
    var paras = $('#head #head_content li');
    var rand = Math.floor(Math.random() * paras.length);
    paras.eq(rand).addClass('logo_white');
};

これはうまくいきますが、複数のクラスを追加する必要がありますが、それぞれに1つのクラスのみを保持します<li>

だから私は別のクラス名で上記のコードを複製しました（これは素晴らしいことではありません）：

countBlocs = 30;
for (i = 1; i <= countBlocs; i++)
{
    var paras = $('#head #head_content li');
    var rand = Math.floor(Math.random() * paras.length);
    paras.eq(rand).addClass('logo_white'); 
};
countBlocs = 30;
for (i = 1; i <= countBlocs; i++)
{
    var paras = $('#head #head_content li');
    var rand = Math.floor(Math.random() * paras.length);
    paras.eq(rand).addClass('logo_red'); <- Another class name
};

...

そして今、私の生成された<li>外観は次のようになります:

<section id='head'>
    <article id='head_content'>
        <li id='losange1' class='losange logo_red'></li>  <- Ok!
        <li id='losange2' class='losange logo_red'></li> <- Ok!
        <li id='losange3' class='losange logo white logo red'></li> <- WRONG!
        <li id='losange4' class='losange logo white'></li> <- Ok!
        <li id='losange5' class='losange logo red logo white'></li> <- WRONG!
        <li id='losange6' class='losange logo red'></li> <- Ok!
        ...
    </article>
</section>

問題 ：

それは同じ上に複数のクラスを追加します。すでに定義されている複数のクラスから<li>ランダムに1つのクラスを追加したいだけです<li>

4

3 に答える 3

1

アイテムを 1 回ループしてから、それぞれにランダムなクラスを追加します。

var colors = ["logo_red", "logo_white"];

for (i = 1; i <= countBlocs; i++)
{
    var liItem = $('#losange' + i);
    var rand = Math.floor(Math.random() * colors.length);
    liItem.addClass(colors[rand]);
};
于 2012-11-22T11:08:38.557 に答える
1

すべてのクラスを配列に配置し、配列でランダムを使用してクラスを取得し、li に追加します。

var classes = ['white', 'red', 'logo_white'];
$('#head #head_content li').each(function() {
  var random = Math.floor(Math.random() * classes.length);
  $(this).addClass(classes[random]);
}
于 2012-11-22T11:05:19.723 に答える
0

あなたはこのようなことをしたい：

 $('#head #head_content li').each(function(n) {
        $(this).addClass(myrandomFunction());
  });

呼び出しごとに1回、ランダムなクラスを返す別の「myrandomFunction」を分割します。

于 2012-11-22T11:10:09.407 に答える