Problem: Javascript nur einmal durchlaufen lassen?

[Jörg Reinholz]

Moin!

Mudgard meint statt

<script language="javascript" type="text/javascript" >		
		function Verschwinden(){
		document.getElementById("Marmor1").style.display="none";
		}
…
		function Verschwinden15(){
		document.getElementById("Eisen5").style.display="none";
		}

sowas:

<script>
function Verschwinde(id){
  document.getElementById(id).style.display="none";
}

und den Aufruf mit:

<div onclick="Add1()"><img onclick="Verschwinde('Marmor1')" src="Marmor.png" id="Marmor1"></div>
…
<div onclick="Add3()"><img onclick="Verschwinde('Eisen5')" src="Eisen.png" id="Eisen5"></div>

Das lösen wor dann mal noch weiter auf und damit ein Problem:

<div><img onclick="Add1(); Verschwinde('Marmor1')" src="Marmor.png" id="Marmor1"></div>
…
<div><img onclick="Add1(); Verschwinde('Eisen5')" src="Eisen.png" id="Eisen5"></div>

Ich bin mir sicher, das div brauchst Du dann nicht mehr:

<img onclick="Add1(); Verschwinde('Marmor1')" src="Marmor.png" id="Marmor1">
…
<img onclick="Add3(); Verschwinde('Eisen5')" src="Eisen.png" id="Eisen5">

Jetzt erst sehe ich: Du lässt ja immer genau das Element verschwinden, auf welches geklickt wird! Das geht besser:

<img onclick="Add1(); this.style.display='none';" src="Marmor.png" id="Marmor1">
…
<img onclick="Add3();  this.style.display='none';" src="Eisen.png" id="Eisen5">

Die Funktionen verschwinde* entfallen also ganz. Aber vielleicht willst Du Diese nicht nur nicht anzeigen, sondern aus dem Dom entfernen. Wie ich lese fallen die ja herunter. Das bedeutet demnach, dass für diese weiterhin völlig sinnlos Positionen berechnet werden. Zeig uns den Code.

Jetzt schauen wir uns mal Deine Add-Funktionen an:

Dein Original:

var Ergebnis = 0;
function Add1() {
  Ergebnis = Ergebnis + 1;
  document.getElementById("AUSGABE2").innerHTML = Ergebnis;
  var max = 1;
}
function Add2() {
  Ergebnis = Ergebnis + 1;
  document.getElementById("AUSGABE3").innerHTML = Ergebnis;
}

function Add3() {
 Ergebnis = Ergebnis + 1;
 document.getElementById("AUSGABE1").innerHTML = Ergebnis;
}

Hm. Sehr ungünstig gelöst. Der Mensch ist Mensch weil er faul ist (deshalb denkt er nach wie er einfacher bzw. schneller, am besten schlafend an sein Essen kommt und spart Kalorien gerne auch beim Nachdenken...) und sich nicht das Gehirn mit derartig sinnfrei überkreuzten Zusammenhängen ( Add1->AUSGABE2 / Add2->AUSGABE3 / Add3->AUSGABE1) zermartern will.

<script>
// Zunächst mal 3 Ergebnisse als Array //
var Treffer = new Array(0,0,0)
// Der beginnt immer mit 0 zu zählen, was sich gleich zeigt. //

function AddTreffer(i) {
//erwartet als Parameter eine Treffer-ID:
// 0=Marmor / 1=Stein / 2=Eisen
  Treffer[i]++;
  document.getElementById('Treffer_' + i).innerHTML = Treffer[i];
}
</script>

Natürlich müsstest Du das Feld in "Treffer_1", …, "Treffer_3") umbenennen. Es geht aber noch besser:

<script>
// Zunächst mal global die Treffer als Objekt //
var Treffer = new Object ();
Treffer['Marmor'] = 0;
Treffer['Stein'] = 0;
Treffer['Eisen'] = 0;
// hat also Elemente mit schönen sprechenden Namen. //

function AddTreffer(s) {
//erwartet als Parameter einen Bezeichner //
// Marmor / Stein / Eisen                 //
  Treffer[s]++;
  document.getElementById('Treffer_' + s).innerHTML = Treffer[s];
}
</script>

Natürlich müsstest Du die Ausgabe-Felder in "Treffer_Marmor", …, "Treffer_Eisen" umbenennen.

Das HTML sähe dann unter Weglassen der (soweit ich das am gezeigten Code sehen kann) verzichtbar gewordenen ID so aus:

<img onclick="AddTreffer('Marmor'); this.style.display='none';" src="Marmor.png">
…
<img onclick="AddTreffer('Eisen'); this.style.display='none';" src="Eisen.png">

Ach so: Es ist damit nicht alles "beim Besten". Das werden Dir aber andere aufschreiben.

Jörg Reinholz