Zellen in einer Tabelle sperren und Counter

[Pettajam]

Hallo zusammen,
ich habe eine Tabelle 4 x 4. In jeder Zelle befindet sich ein Zähler beim ersten Klick auf die Zelle auf 1 hoch geht und beim zweiten Klick soll er wieder auf 0 zurück gehen.

Aber irgendwie klappt meien ifabfrage dazu nicht, hoffe Ihr könnt mir weiter helfen.

function zahl() {
if (document.getElementById("clicked").value = "0"){
document.getElementById("clicked").value = "1"}

else {document.getElementById("clicked").value = "0"}
}

<td onclick="zahl()"><input id="clicked" size="3"  value="0" /></td>

Dann hab ich noch ein Problem, wenn in einer Spalte der Tabelle eine Zelle angeklickt ist, sollen die andern 3 nicht mehr anklickbar sein.

Aber irgendwie habe ich keien ahnung wie ich das machen soll.

Ich hoffe Ihr könnt mir paar Denkanstösse geben.

MfG
Pettajam

[fastix®]

Moin!

function zahl() {
if (document.getElementById("clicked").value = "0"){
document.getElementById("clicked").value = "1"}

else {document.getElementById("clicked").value = "0"}
}

1. Wenn die Zuweisung des Wertes 1 zu document.getElementById("clicked").value klappt, dann wird
document.getElementById("clicked").value = "1" gesetzt. Also immer, vorausgesetzt document.getElementById("clicked") ist ein gültiges Objekt und hat die gültige Eigenschaft "value".

Du hast einen Typo: Im Vergleich sind zwei Gleichheitszeichen nötig, sonst machst Du eine Wertzuweisung und wenn die funktioniert wird "wahr" zurück gegeben. Das wolltest Du aber nicht.

2. Eine Zelle in einer Tabelle hat aber nicht die Eigenschaft "value". Du kannst aber "innerHTML" verwenden. Ich habe mit der alternativen Eigenschaft "innerText" schlechte Erfahrungen. (Firefox)

Korrekturvorschlag (ungetestet)

function zahl() {  
 	if (document.getElementById("clicked").innerHTML == "0"){  
              document.getElementById("clicked").innerHTML = "1";  
        } else {  
              document.getElementById("clicked").innerHTML = "0";  
        }  
}

Alternativer Vorschlag (als Einzeiler, ebenfalls ungetestet):

document.getElementById("clicked").innerHTML = (var Ergebnis = (document.Formular.Eingabe.value == "0") ? "1" : "0");

Weitere Informationen findest Du http://de.selfhtml.org/javascript/sprache/bedingt.htm@title=hier.

MFFG (Mit freundlich- friedfertigem Grinsen)

fastix

[fastix®]

Moin!

document.getElementById("clicked").innerHTML = (var Ergebnis = (document.Formular.Eingabe.value == "0") ? "1" : "0");

Muss natürlich lauten:

document.getElementById("clicked").innerHTML = (document.getElementById("clicked").innerHTML == "0") ? "1" : "0");

Das kannst Du auch direkt an der Zelle anwenden (ungetestet):

<td onclick='this.innerHTML = (this.innerHTML == "0") ? "1" : "0")'>0</td>

"this" sollte in diesem Fall das angeklickte Zellobjekt sein.

MFFG (Mit freundlich- friedfertigem Grinsen)

fastix

[Der Martin]

Hallo,

[...] sonst machst Du eine Wertzuweisung und wenn die funktioniert wird "wahr" zurück gegeben.

das ist nicht wahr, auch wenn es oft behauptet wird. ;-)
Richtig ist vielmehr: Eine Zuweisung ergibt als Wert den Wert des zugewiesenen Ausdrucks. Wenn der im boolschen Sinn als true gilt, wird der if-Zweig ausgeführt.
Der String "0" wird übrigens zu true ausgewertet.

Im folgenden Beispiel wird aber der if-Zweig nie ausgeführt, obwohl die Zuweisung klappt:

if (foo=0)
      alert("Bingo!");

Der Zahlenwert 0, der hier zugewiesen wird, ergibt im boolschen Kontext false, die if-Abfrage springt also nicht darauf an.

Ciao,
 Martin

[EKKi]

Mahlzeit Pettajam,

ich habe eine Tabelle 4 x 4. In jeder Zelle befindet sich ein Zähler

Bedeutet das auch, dass in jeder Tabellenzelle ein Eingabeelement vorhanden ist? Wenn ja: Du weißt schon, dass eine ID Dokument-weit eindeutig sein muss, d.h. die Textfelder dürfen nicht alle dieselbe ID haben?

Aber irgendwie klappt meien ifabfrage dazu nicht, hoffe Ihr könnt mir weiter helfen.

Leider nicht, da "klappt [...] nicht" als Äquivalent von "funzt net" leider keine hilfreiche Problembeschreibung ist.

Du hast beschrieben, was passieren *soll*. Was passiert *stattdessen*? Was sagt die Fehlerkonsole Deines Browsers?

MfG,
EKKi

[Don P]

Hallo,

<td onclick="zahl()"><input id="clicked" size="3" value="0" /></td>

In jeder Zelle befindet sich ein Zähler

Ich nehme an, du meinst mit "Zähler" das Input-Feld.
Und die haben alle gleiche id "clicked"? Das darf natürlich nicht sein, wurde ja schon gesagt.

Dass value = "0" und value = "1" keine Vergleiche sind, wurde auch schon gesagt.

Du übertreibst es übrigens mit dem x-fachen Aufruf von document.getElementById.
So geht's in deinem Fall auch, und ganz ohne id:

function zahl() {
        var zählerElt = this.firstChild;
zählerElt.value = zählerElt.value == "0" ? "1" : "0";
}

Oder ganz tricky:
zählerElt.value = +!+zählerElt.value;
Erklärung:

1. +zählerElt.value wandelt den Wert in eine Zahl (0 oder 1)
2. !+zählerElt.value negiert den booleschen Wert dieser Zahl, ergibt also true oder false
3. +!+zählerElt.value wandelt dieses Ergebnis wieder zu einer Zahl, ergibt also 1 oder 0

Gruß, Don P

[Der Martin]

Aber hallo,

Oder ganz tricky:
zählerElt.value = +!+zählerElt.value;
Erklärung:

1. +zählerElt.value wandelt den Wert in eine Zahl (0 oder 1)
2. !+zählerElt.value negiert den booleschen Wert dieser Zahl, ergibt also true oder false
3. +!+zählerElt.value wandelt dieses Ergebnis wieder zu einer Zahl, ergibt also 1 oder 0

wow, ich bin beeindruckt!
Und das will was heißen ...

Man hätt's ja auch ohne den Umweg über Boolean machen können:
zählerElt.value = 1 - zählerElt.value;

Sieht aber bei weitem nicht so geheimnisvoll aus wie deine Variante. ;-)

Ciao,
 Martin

[Don P]

Hallo,

wow, ich bin beeindruckt!
Und das will was heißen ...

*brustschwell* ;)

Man hätt's ja auch ohne den Umweg über Boolean machen können:
zählerElt.value = 1 - zählerElt.value;

Nö, das ergibt mit value == "0":
1-0 = 1
also bleibt der Wert unverändert, was ja nicht sein soll.

Gruß, Don P

[Der Martin]

Hi,

wow, ich bin beeindruckt!
Und das will was heißen ...
*brustschwell* ;)

Mooooment!

Man hätt's ja auch ohne den Umweg über Boolean machen können:
zählerElt.value = 1 - zählerElt.value;

Nö, das ergibt mit value == "0":
1-0 = 1

Also wurde die 0 zu einer 1.
 q.e.d.
Umgekehrt geht's übrigens auch.

also bleibt der Wert unverändert, was ja nicht sein soll.

Okay, zieh mal die Brust wieder ein. ;-)

Ciao,
 Martin

[Don P]

Hallo,

Okay, zieh mal die Brust wieder ein. ;-)

Weia, wo hab' ich denn da hingedacht? Du hast natürlich recht, und auch mit der Feststellung, dass es bei weitem nicht so geheimnisvoll aussieht wie meine Variante, hehe. Bliebe noch zu erforschen, was schneller geht... vermutlich sogar deine Version.

Gruß, Don P