2011-01-07 46 views
1

我有以下結構的一系列的div的DIV:循環在使用jQuery

<div id="team"> 

     <div class="member"> 
      <p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo.</p> 
     </div> 

     <div class="member"> 
      <p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo.</p> 
     </div>  

     <div class="member"> 
      <p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo.</p> 
     </div>  

     <div class="member"> 
      <p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo.</p> 
     </div> 

    </div> 

我想在每個格使用jQuery循環,並添加類floatLeft的(如果是偶數格)和floatRight(如果它是奇數)。我試着用下面的代碼做到這一點,但它添加floatLeft和floatRight到所有div ...

var $el,i,$selectedDivs,count; 

    $selectedDivs = $('#team > div'); 
    count = $selectedDivs.length; 

    $selectedDivs.each(function() { 
     $el = $(this); 

     for (i=0; i<=count; i++) { 
      if (i % 2 == 0) { 
       $el.addClass('floatLeft'); 
      } 
      else { 
       $el.addClass('floatRight'); 
      } 
     } 
    }); 

我猜這是因爲。每()函數的...我的問題是這樣的。由於$ selectedDivs不是一個數組,我怎樣才能使用for循環代替.each()函數來循環每個div?我故意要用這種方式,而不是jQuery的.odd()和:odd功能...

謝謝! Amit

+0

我在這裏猜測,但我認爲你不應該使用「#team> div」但是「#team div」沒有> – JCOC611 2011-01-07 03:09:29

回答

2

您應該使用for循環或each,但不能同時使用兩者。

for循環中,您可以編寫$selectedDivs.eq(i).addClass

+0

是的,這是做到了。非常感謝你。我想知道如何將第i個元素集成到for循環中,現在我記得eq(i)部分。精彩。 – Amit 2011-01-07 03:13:59

0

我的問題是這樣的。由於$ selectedDivs不是一個數組,我怎樣才能使用for循環代替.each()函數來循環每個div?

啊,但它是。試試這個代碼:

int counter = $selectedDivs.length - 1; //zero based so sub one 
for (; counter > 0; counter--){ //note I went for the backwards loop here, your preference 
    var javascriptElement = $selectedDivs[counter]; 
    // I like to play with my javascriptElement in the morning 
    // I like to play with my javascriptElement in the afternoon 
    // I like to play with my javascriptElement in the evening 
} 

這不正是問什麼。

+0

它在技術上並不是一個數組,但它確實像一個Array.prototype.push.apply被調用。 – jpsimons 2011-01-07 03:14:22

2

你的函數應該如下,而不是這樣寫:「Python化」

var i = 0; 
$selectedDivs.each(function() { 
    $el = $(this); 

    if (i % 2 == 0) { 
     $el.addClass('floatLeft'); 
    } 
    else { 
     $el.addClass('floatRight'); 
    } 
    i++; 
}); 
+0

這也適用。不過,我更喜歡使用@SLaks給出的for循環方法。感謝您的幫助,非常感謝。 – Amit 2011-01-07 03:14:34

1

有一個字我在尋找,在Python世界中這是這個詞的意思是「符合常用成語」,但是對於jQuery。 「jQueryish?」

jQuery("#team > div:even").addClass("floatLeft"); 
jQuery("#team > div:odd").addClass("floatRight"); 
+0

我還應該注意到,我總是喜歡寫出「jQuery」而不是使用美元符號。爲什麼?像Cheetah這樣的模板系統使用美元符號進行變量插值,你可以更好地與其他庫(如原型)搭配使用,而且,反覆的字符串可以很好地壓縮gzip,而大多數服務器仍然使用它。 – jpsimons 2011-01-07 03:24:13