3 zeilen markieren

Computer: Software & Programmierung JavaScript & Script-Sprachen
1

Hallo,

kann jemand mir helfen bitte ?
Folgendes habe ich vor.
Eine Tabelle mit beliebig viele Zeilen.
Es dürfen aber nur 3 ausgewählt werden, max. 3 Zeilen.
Diese 3 markierte Zeilen werden farbig dargestellt.

Funktion:
Wenn man die zeile anklickt, dann wird sie markiert.
Wenn man sie nochmals anklickt, dann wird sie unmarkiert.

Nur 3 können max. markiert bzw. ausgewählt werden.
Wenn man schon 3 markiert hat und man klickt auf eine weitere, dann passiert eben nichts, bis man wieder eines der markierten wieder unmarkiert.

Ich habe soweit geschafft, dass man die Sachen markieren kann und unmarkiert, aber der resr leider nicht. Programmierlogik fehlt bei mir :smile:)
Kann jemand mir helfen ? So sieht mein jetziger Script aus und es läuft nur unter Netscape 6.x und IE 5.5

.hallo{Color: #0000FF;Background-Color: #FFFFFF;Border: 1px solid #333399;Width: 300px;}

merker=1;
anzahl=0;
function farbwechsel(nr,zustand){
alert(anzahl)

if (merker==1){
if (anzahl>2){
merker=0;
}

else {
document.getElementById(‚t‘+zustand).style.backgroundColor="#ff99ff";
merker=0;
anzahl=anzahl+1;
}
}
else{
if (anzahl==3){
anzahl=anzahl-1;
document.getElementById(‚t‘+zustand).style.backgroundColor="#FFFFFF";
merker=1;
} else{
document.getElementById(‚t‘+zustand).style.backgroundColor="#FFFFFF";
merker=1;
}
}

}

Vielen Dank im voraus !

Gruss,

Loren :smile:

2

Hi Loren,

ich habe deinen Code mal etwas angepasst und bei mir funktioniert das Ganze.

Beschreibung untendrunter…

var anzahl=0;
var farbe;

function farbwechsel(id)
{
 farbe = document.getElementById(id).style.backgroundColor;

 if( farbe == "#ff99ff" )
 {
 document.getElementById(id).style.backgroundColor="#ffffff";
 anzahl--; 
 }

 if( ( farbe == "" || farbe == "#ffffff" ) && anzahl \< 3 )
 {
 document.getElementById(id).style.backgroundColor="#ff99ff";
 anzahl++;
 }
}

.
.
.

.
.
.

Ich habe noch nicht viel mit Javascript und CSS rumgehackt, aber anscheinend besitzt bei jedem Element am Anfang das Attribut backgroundColor keinen Wert :frowning:
Deshalb also die Abfrage, ob denn der farbe-Wert leer ist oder #ffffff enthält.
Sobald man dem backgroundColor-Attribut eines Objektes einen Wert zuweist, ist dieser dann auch überprüfbar.

Achtung: Ich habe die Parameterübergabe geändert, also musst du auch deine onClick()-Aufrufe anpassen.

Ciao, Bill
P.S.: Bei Fragen einfach posten oder mailen…

3

Hallo,

viel zu kompliziert… :smile:

Du nimmst als erstes ein HTML-Skelett.

Im Header bindest Du den folgenden Style ein:

\<!--

.cssTxtSelected
{
 background-color:red;
 color:while;
}

.cssTxtNotSelected
{
 background-color:blue;
 color:white;
}

--\>

Ausserdem bindest Du ein das folgende Skript ein:

\<!--

var curSelect = 0;
var maxSelect = 3;

function onSelectTxt(prmThis)
{
 if ((typeof(prmThis)=="object") && (prmThis.type="text")) {

 if (("cssTxtNotSelected"==prmThis.className) && (curSelect\<maxSelect)) {
 prmThis.className = "cssTxtSelected";
 curSelect++;

 } else if ("cssTxtSelected"==prmThis.className) {
 prmThis.className = "cssTxtNotSelected";
 curSelect--;
 }
 }
}

//--\>

Im Body sieht die Tabelle als Beispiel wie folgt aus:

Funktioniert selbstverstaendlich nicht im Netscape4. Eine Loesung ueber ilayers kann ich mir aber vorstellen.
Obiges sollte auch im Netscape6 funktionieren (nicht getestet) und vielleicht auch im Opera.

CU