我知道我在這裏接近，但它只會增加從顏色數組類，一日3郵箱的div：從陣列中應用類的重複項目使用jQuery

$(document).ready(function($) { 

    var toCopy = $('.postbox'); 
    var colors = ['box1','box2','box3']; 

    for (var i = 1;i < 7;i++) { 
     $('.rightCol').append(toCopy.clone()); 
    } 

    $('.postbox').each(function(i, val) { 
     $(this).addClass(colors[i]); 
    }); 

});

這裏的最終結果使用以上內容：

<div class="rightCol"> 
    <div class="postbox box1"></div> 
    <div class="postbox box2"></div> 
    <div class="postbox box3"></div> 
    <div class="postbox"></div> 
    <div class="postbox"></div> 
    <div class="postbox"></div> 
    <div class="postbox"></div> 
</div>

如何讓它保持重複？

來源

2012-02-23 Rob

你有一個例子嗎？ – 2012-02-23 05:06:08

$('.postbox')有7個元素，colors只有3個。這就是爲什麼只有前3個有顏色。

如果您想讓顏色在列表中循環，您必須使用modulo operator,%。

$('.postbox').each(function(i, val) { 
    $(this).addClass(colors[i % colors.length]); 
});

DEMO：http://jsfiddle.net/Rt6z6/

來源

2012-02-23 05:07:48

有沒有一種方法可以循環這些3並將類應用到其他4？ – Rob 2012-02-23 05:10:02

@Rob：我編輯了我的答案。使用'i％colors.lenth'應該可以做你想做的事。當你循環元素時，它將循環遍歷顏色數組。 – 2012-02-23 05:11:43

嗯，似乎沒有工作 - 我會亂它一下 – Rob 2012-02-23 05:18:13

您可能需要使用%操作：

$(this).addClass(colors[i%colors.length]);

試試看：http://jsfiddle.net/DerekL/xgnnc/

的`%`操作

根據W3Schools，%運營商意味着Modulus，它給你的其餘部門。

例如：

3 % 2會給你1因爲2 x 1 +1 = 3。

希望它能幫助你！

的`%`其他用途！

%在確定一行是奇數還是偶數時非常有用。
參考：http://snook.ca/archives/php/the_modulo_oper

(i % 2) ? /*Even*/ : /*Odd*/

由於i % 2會給你只有0或1

來源

2012-02-23 05:12:06

從陣列中應用類的重複項目使用jQuery

回答

的%操作

的%其他用途！

相關問題

的`%`操作

的`%`其他用途！