Jan Sanders: Tabellen - automatische Zuweisung einer Zellenfarbe

Hurra, ich habe einen kleinen JavaScript-Shop gebastelt.
Wie in anderen Shops üblich sollen auch bei mir die ausgewählten Artikel farbig gegeneinander abgesetzt werden.
Über reguläre Ausdrücke ist es mir tatsächlich gelungen, dass die erste, dritte, fünfte etc. Zeile eine andere Farbe zugewiesen bekommt.

Bei weniger als drei Zeilen ( bei weniger als drei Artikeln ) soll grundsätzlich keine farbige Abstufung erfolgen.
Oder andersrum: die Abstufung soll erst vorgenommen werden, wenn mindestens drei Artikel ausgewählt wurden. Und hierbei bin ich gescheitert !

Zur Demonstration eine kleine Tabelle, die meinem Shop täuschend echt nachempfunden ist.

<HTML>
<HEAD>
</HEAD>
<BODY>
<SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript">
<!--
document.write("<table width='50%' border='1'>");
document.write("<tr>");
for (n = 1; n < 20; n++)
{
//
var zelle = 'red';
var ungerade = /[13579]$/;
if (ungerade.test(n))
zelle = 'blue';
//
document.write("<td width='0' valign='middle' align='center' bgcolor='"+zelle+"'> </td>");
}
document.write("</tr>");
document.write("</table>");
//-->
</SCRIPT>
</BODY>
</HTML>

Die Variable "n" steht hier für die Anzahl der gewählten Artikel. "n" ist auf  20 gesetzt, um den Effekt zu illustrieren.
Wenn "n" auf 1 oder 2 gesetzt wird, soll die Zelle ( sollen die Zellen ) rot bleiben, wenn "n" größer als 2 wird, sollen Zelle 1,3,5,7,9,11 etc. blau werden und die anderen rot bleiben.

Mit einem "if (n > 2)" komm ich nicht weiter, weil dann in allen Fällen die este und zweite Zelle rot bleiben. Das ist bitter.

Ich tippe auf eine "while" Lösung, bin aber bisher an allen Konstrukten gescheitert. Die Lösung ist bestimmt zum totlachen einfach ! Ich schäme mich schon jetzt .....

Mit Dank für jede Hilfe
Gruss Sanders

  1. Hallo Sanders,
    ich würde das so machen:<html>
    <head>
    </head>
    <body>
    <script language="JavaScript">
    <!--
    var a=1;
    var farbe="red";
    var zellen=20;
    var tabelle="";
    tabelle=tabelle.concat("<table><tr>");
    for(var n=0;n<=zellen;n++) {
    tabelle=tabelle.concat("<td bgcolor="+farbe+">   </td>");
    if(zellen>2){
    a=a*-1;
    if(a<0){farbe="blue"}
    else{farbe="red"}}}
    tabelle=tabelle.concat("</tr></table>");
    document.write(tabelle);
    //-->
    </script>
    </body>
    </html>
    So kannst du auch die Konstruktion mit dem Regulärem Ausdruck vermeiden.

    Gruss Oskar

    1. Tricky, aber es funktioniert. Ob es mir gelingt, das jetzt in meinen eigentlichen Shop umzusetzen ?
      Dank nochmals an Oskar

  2. hi,

    Hurra, ich habe einen kleinen JavaScript-Shop gebastelt.

    warum - willst du etwa bewusst von einem bestimmten anteil deiner potentiellen kundschaft keine bestellungen bekommen, weil du ihnen nichts anzeigst?

    gruss,
    wahsaga