[FRAGE] Funktion soll bestimmten Array auslesen

[RocketRaccoon]

Guten Abend liebe Community...

Ich bin momentan dabei Javascript zu erlernen. Jetzt bin ich leider an einer Stelle angekommen, wo ich nicht weiter weiß
und hoffe hier eventuelle Lösungsansätze oder sogar Beispiele zu bekommen.

Ich habe ein Bild, welches in vier Teile aufgeteilt ist und mit onmouseover="showinfo()" eine Funktion startet.
Zusätzlich habe ich ein mehrdimensionales Array (Beispielhaft):

PicInfo = new Array();
PicInfo[0] = new Array('0','hans','herbst');
PicInfo[1] = new Array('1','peter','winter');
PicInfo[2] = new Array('2','tom','sommer');
PicInfo[3] = new Array('3','tim','fruehling');

Ziel ist es, dass die Funktion showinfo() die Informationen des Arrays PicInfo[0] in einer Tabelle ausgibt, sofern ich mit der Maus über eines der vier Bereiche des Bildes gehe. Gehe ich mit der Maus über ein anderen Teil des Bildes, so soll die Funktion ein anderes Array auslesen.
Hoffe, ihr könnt mir da etwas helfen.

Mit freundlichen Grüßen

 

[kkapsner]

Du musst der Funktion showinfo() schon irgendwie sagen, was genau angezeigt werden soll.
Wie sieht die denn genau aus?

PS: Arrayliterale sind schneller und leichter zuschreiben und haben kein Verhalten, das davon abhängig ist, was man ihnen als Datentyp übergibt:

var picInfo = [
	["0", "hans", "herbst"],
	["1", "peter", "winter"],
	...
]

PPS: Meistens werden in JS alle Variablen, außer Konstruktoren, klein geschrieben. Ist auch im JS-Sprachkern so und erleichtert so anderen, die deinen Code lesen, das verstehen.

 

[Sempervivum]

Ich würde der Funktion showinfo() einen Index mitgeben, der am besten gleich dem Index in dem Array ist, z. B. onmouseover="showinfo(0)". Damit kannst Du dann direkt auf das Array zugreifen und die Werte auslesen. Wie Du die Zellen in der Tabelle adressierst, kannst Du hier nachlesen:
HTML DOM Table cells Collection
oder mit jQuery hier:
http://stackoverflow.com/questions/...te-through-table-rows-and-cells-in-javascript
Den jeweiligen Wert kannst Du mit innerHTML in die Tabellenzelle eintragen.
Solange das Unter-Array nur drei Werte hat, macht eine Tabelle natürlich wenig Sinn. Aber Du schreibst ja "Beispielhaft" und ich nehme an, dass es in Wirklichkeit mehr Elemente sind, u. U. auch zweidimensional wie in einer Tabelle.

 

[RocketRaccoon]

Vielen Dank für die Lösungen, so richtig hat es leider noch nicht geklappt, aber ich bin dran ;-)

Hier der javascript:

<script type="text/javascript">

function showinfo(){
picinfo = new Array();
picinfo[0] = new Array('eins','hans','herbst');
picinfo[1] = new Array('zwei','peter','sommer');


document.form.text.value = picinfo[0][1];
}

</script>

* Der ausgegebene Wert wird in einem Textfeld ausgegeben


Wenn ich der Funktion den Index 1 gebe: onmouseover="showinfo(1)";
wie genau muss ich dann die Funktion an sich abändern?

 

[Sempervivum]

Na, ich war der Meinung, so:

function showinfo(idx){
picinfo = new Array();
picinfo[0] = new Array('eins','hans','herbst');
picinfo[1] = new Array('zwei','peter','sommer');


document.form.text.value = picInfo[idx][1];
}

Aber da hattest Du zwei verschiedene Variablennamen: picInfo und MapInfo. Sollte beides dasselbe sein?
In deinem ersten Posting schriebst Du doch, die Werte sollen in eine Tabelle geschrieben werden? So richtig erschließt sich mir noch nicht, was Du da genau vorhast.

 

[RocketRaccoon]

Das mit den zwei Variablen war leider ein Tippfehler von meiner Seite aus. Den habe ich im vorherigen Beitrag geändert.
Der von dir geänderte Code funktioniert wirklich einwandfrei. Danke dafür.
Ich habe nicht daran gedacht bzw. noch nicht gewusst, dass man "idx" nutzen kann und die Felder immer leer gelassen.

Die Werte sollen auch später in einer Tabelle ausgegeben werden. Soweit bin ich aber noch nicht. Im Grunde sind das alles nur Übungsaufgaben für mich, um Javascript zu erlernen. Ein richtiges Ziel habe ich mir dabei noch nicht gesetzt.

Mit freundlichen Grüßen

 

[Sempervivum]

Vielleicht hilft es dir dann, wenn Du etwas über die Grundlagen liest, z. B. hier:
SELFHTML: JavaScript / Sprachelemente / Funktionen