Im HTML ein Array an JS übergeben

Question

Hallo,

ich habe folgendes Problem:

ich hab in meinem HTML-Dokument drei DIV-Container, jedes mit einer eigenen ID.

Dann hab ich ein Form, wo ich drei Radiobuttons definiert habe. Bei Klick auf einem sollen zwei DIVs unsichtbar werden usw...Bei Klick auf ein anderes Radiobutton die andern beiden unsichtbar.

Nun wollte ich dies relativ dynamisch gestalten, d.h. wenn ich mal ein Dokument mit mehr als 3 Divs habe, sollte das auch noch funktionieren. Daher wollte ich zwei Funktionen bauen, eine zum Verstecken und eine zum Anzeigen, und jede dieser Funktionen übergebe ich die IDs zum Anzeigen/Verstecken mit Hilfe eines Arrays. Array deshalb, damit ich 1 - unendlich viele Divs auf einmal bearbeiten kann. Der Code sieht folgendermaßen aus:

function hide(array)
{
alert(array);
for (var id in array) {
document.getElementById(id).style.display = "none";
}
}

Im Html hab ich für das onclick-Event folgendes eingetragen:

<input type="radio" name="selection" value="insert" onclick="hide(new array('import', 'insert'));" />

'import' und 'insert' sind dabei die IDs meiner beiden divs die ich verstecken möchte.
Leider funktioniert das nicht so. Firebug meldet dabei folgendes:
array is not defined

Was muss ich tun, damit es funktioniert?

Vielen Dank schon mal im Voraus

Answer 1

Denke mal, wenn es kein tippfehler ist, liegt es am =

if (document.getElementById(id).style.display = "none") {...

Ein = ist ein Zuweisung, Zwei = ist ein vergleich.

Sprich in der if-Abfrage weist du document.getElementById(id).style.display den Wert "none" zu und vergleichst nicht ob das element den Wert "none" hat.

In der 2. Variante nutzt du ja zwei = deswegen funktioniert auch die 2. Variante

Answer 2

Aso, und in der 1. Variante sagst du wenn display == "none" ist, dann soll display der wert "none" zugewisen werden.

Answer 3

Hm was für blöde fehler...hab sie beseitigt, die seite ungefähr 10x neugeladen, und es geht immer noch nicth :-(

hier nochmal der korrigierte Code:

function toggleDisplay()
{
for (var id in arguments) {
if (document.getElementById(id).style.display == "none") {
document.getElementById(id).style.display = "block";
} else {
document.getElementById(id).style.display = "none";
}
}
}

wenn ich direkt über der if-abfrage ein alert( ) hinsetze, wird dieses ebenfalls nicht ausgeführt...da stimmt doch was nicht :-(

Answer 4

Was sagt denn die Fehlerkonsole vom FF?

Ansonsten versuch es mal mit der andere variante der for-schleife( for(var i = 0; i < arguments.length;...)

Answer 5

die diversen Browser interpretieren arguments scheinbar verschieden, in Opera klappts mit for in ein bisschen, im Firefox gar nicht und IE hab ich lieber erst gar nicht getestet.

besser ist die Funktion so:

function toggleDisplay() {
for (var i = 0; i < arguments.length; i++) {
var e=document.getElementById(arguments[i]);
e.style.display = (e.style.display == "block") ? "none" : "block";
}
}

dann muss getElementById nicht so oft aufgerufen werden. Es reicht das Element 1mal zu suchen!

Answer 6

Die Fehlerkonsole sagt nix...keine Fehler. es geht nur einfach nicht. ABer ok, wenn ich weiß, dass das nicht alle Browser können, mach ich es so wie in dem letzten Tipp! Danke für die super Optimierung!