Frage

Ich habe hier ein Beispiel eines typischen Stück JavaScript (Code, den ungerade eine Hintergrundstil-Klasse mit einem Wechsel gelten würde oder sogar in einer Tabellenzeile) bekomme. Ich versuche, dies in Coffeescript in meinem Versuch, neu zu schreiben, das zu lernen. Die Coffee Bereich Syntax ist anders und Rubin-artige. Ich würde wirklich ein Beispiel schätzen, wie Sie dies tun würden?

   function alternate(id){ 
     if(document.getElementsByTagName){  
       var table = document.getElementById(id);   
       var rows = table.getElementsByTagName("tr");   
       for(i = 0; i < rows.length; i++){           
     //manipulate rows 
         if(i % 2 == 0){ 
           rows[i].className = "even"; 
         }else{ 
           rows[i].className = "odd"; 
         }       
       } 
     } 
    }

Update

Ich bin mit JQuery und zu versuchen, diese aber es funktioniert nicht (es macht alle Zeilen #efefef):

$(document).ready ->
    rowCount = $('tbody tr')
    for row in rowCount        
        if row.length % 2 == 0
            $('tbody tr').css('background-color', '#363636')
        else
            $('tbody tr').css('background-color', '#efefef')
War es hilfreich?

Lösung

Ein wenig prägnante:

for row, i in $('tbody tr')
  color = if i % 2 is 0 then '#363636' else '#efefef'
  $(row).css 'background-color', color

Andere Tipps

Sie können auch in den gerade / ungerade Meta-Selektoren von jquery

vorgesehen interessiert sein
$('tbody tr:even').css 'background-color', '#363636'
$('tbody tr:odd').css 'background-color', '#efefef'

Wenn Ihr Endziel ist nur eine andere Art zu gerade / ungerade Zeilen anwenden, können Sie dies versuchen:

// CSS file

#myTable tr:nth-child(even) { background-color: #363636; }
#myTable tr:nth-child(odd)  { background-color: #efefef; }

Kein JS hier, einfach nur CSS, das gut, da Styling ist eine Präsentation betreffen.

es funktioniert jedoch nur in (relativ) modernen Browsern: IE 9+, Firefox 4+, Chrome ...

Versuchen for row, i in rows, wo i den Schleifenzähler hält.

Lizenziert unter: CC-BY-SA mit Zuschreibung
Nicht verbunden mit StackOverflow
scroll top