Andere div's als das gewählte verstecken? - Javascript-Forum JSwelt (Javascript, PHP, MySQL, AJAX, Webdesign)

badbandit · registriert: 17-04-2006

hi,

nachdem ich mich zwar ganz gut mit php auskenne, in javascript aber leider noch keine leuchte bin, bin ich froh, daß ich dieses forum gefunden habe - hallo!

mit meinen bescheidenen kenntnissen habe ich mir eine kleine funktion gebastelt, mit der ich durch den klick auf einen link den inhalt eines div's, mit der css eigenschaft "display: none", anzeigen und wieder verstecken kann. jedes der div's hat eine eindeutige id.

wenn ich jetzt aber mehrere links habe, die mehrere div's ansprechen, dann werden beim öffnen des einen div's, die möglichweise angezeigten anderen div's nicht wieder ausgeblendet (was ich aber gerne erreichen würde). irgendwo habe ich gelesen, daß man entweder ein array aller in frage kommenden div's angibt oder diese automatisch ermitteln kann. beide lösungen wären mir recht, wobei die letzte vermutlich flexibler, bzw. einfacher "wartbar" ist.

wie könnte ich mein problem lösen?

hier mein bisheriger code:

<script language = "JavaScript">

</script>

<a href="javascript:;" onclick="showLayer('x1');">ausklappen 1</a>
<a href="javascript:;" onclick="showLayer('x2');">ausklappen 2</a>
<a href="javascript:;" onclick="showLayer('x3');">ausklappen 3</a>

<div style="display: none;" id="x1">Ebene 1</div>
<div style="display: none;" id="x2">Ebene 2</div>
<div style="display: none;" id="x3">Ebene 3</div>

ich würde mich freuen, wenn mir hier jemand bei der lösung meines problemes helfen würde!

danke & gruss

**AW: Andere div's als das gewählte verstecken? -** 17-04-2006, 21:23

Moin!

Ist es denn so, daß Du (wie es aussieht) beim Klicken auf einen Link immer nur einen Div anzeigen willst, oder kann das auch anders sein?

Ahoi - Pit

badbandit · registriert: 17-04-2006

hi,

wow, das ging aber schnell

ja, ich möchte immer dann, wenn der link zum zeigen eines bestimmten div's geklickt wird, alle anderen div's versteckt werden.

die vergabe der div-id-namen sollte natürlich einer bestimmten logik folgen (z.b. gleich beginnen und dann eine ziffer/zahl), da es ganz bestimmt noch andere id's/div's geben wird, die mit dieser funktion nichts zu tun haben.

**AW: Andere div's als das gewählte verstecken? -** 17-04-2006, 21:52

Hi!

Da sollte sowas reichen:

PHP-Code:

  <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">

<meta http-equiv="Content-Script-Type" content="text/javascript">

<title>Beispiel</title>

<script type="text/javascript">

<!--

var letzter;

function zeigVersteck(objectId) {

if (document.getElementById) {

d=document.getElementById(objectId)

if(letzter&&letzter!=d)letzter.style.display = "none";

if (d.style.display == "block")d.style.display = "none";

else d.style.display = "block";

letzter=d;

}

}

function versteck(){

if (document.getElementById) {

d=document.getElementsByTagName('div');

for (var i=0;i<d.length;i++){

if(d[i].className=='hide')d[i].style.display='none';

}

}

}

//-->

</script>

</head>

<body onload="versteck()">

<a name="dummy"></a>

<div><a href="#dummy" onclick="zeigVersteck('Text1');return false">Text 1</a></div>

<div id="Text1" class="hide"> Hier ist der erste Text!!!</div>

<div><a href="#dummy" onclick="zeigVersteck('Text2');return false">Text 2</a></div>

<div id="Text2" class="hide"> Hier ist der zweite Text!!!</div>

<div><a href="#dummy" onclick="zeigVersteck('Text3');return false">Text 3</a></div>

<div id="Text3" class="hide"> Hier ist der dritte Text!!!</div>

<div><a href="#dummy" onclick="zeigVersteck('Text4');return false">Text 4</a></div>

<div id="Text4" class="hide"> Hier ist der vierte Text!!!</div>

</body>

</html>

Ahoi - Pit

badbandit · registriert: 17-04-2006

hi pit,

super, danke für die hilfe! das funktioniert ja schon wirklich super.

mir wäre es aber (aus technischen gründen) sehr lieb, wenn man den zusatz im body-tag (<body onload="versteck()">) auslassen könnte.

eigentlich müsste es doch ohne gehen, da "style="display: none;"" ja schon dafür sorgt, dass die inhalte der div's nicht angezeigt werden. es wäre super, wenn man das so regeln könnte!

**AW: Andere div's als das gewählte verstecken? -** 17-04-2006, 22:08

Moin!

Dann wären aber bei usern, die JS nicht am Start haben, die Inhalte der Divs unsichtbar.

Ahoi - Pit

badbandit · registriert: 17-04-2006

jo, damit hast du recht, aber nach 8 jahren selbständiger erfahrung mit dem internet denke ich heute, daß die user, die das internet WIRKLICH nutzen wollen, javascript/css aktiviert und die aktuellen browser nutzen sollten. ich habe mich zu viele jahre mit den unterschieden und einschränkungen herumschlagen müssen. das internet ist zu zentral, als dass man übermäßig rücksicht auf "spezial-gruppen" nehmen sollte. meine einstellung ist für mich zwar neu, aber eine andere würde mich auch zum tabellen-basierten design zwingen...

wenn du also eine andere lösung hast, wäre ich dir sehr dankbar!

**AW: Andere div's als das gewählte verstecken? -** 17-04-2006, 22:18

PHP-Code:

  <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"

"http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">

<title>Aktiviere JS, Du Ar***</title>

</head>

<body>

<!-- (ca. 10% der "Welt" surfen ohne JS) -->

</body>

</html>

badbandit · registriert: 17-04-2006

aha, das ist also ein weg, damit das ganze mit javascript kompatibler gestalten kann. gute möglichkeit!

ich brauche das javascript nicht für eine allgemein zugängliche internetseite, sondern für admin-oberflächen für kunden. hier kann ich dem kunden vorgeben, was er zu nutzen hat. weil auch ein wysiwyg-editor verwendet wird, muß javascript ohnehin aktiv sein.

ich kann deshalb noch kein javascript, weil ich es schon immer ungern auf öffentlichen seiten eingesetzt habe, weil es oft nur abhängig vom client funktionierte. ich habe die lösung: php, html und reload der seite für derartige lösungen bevorzugt.

da du sehr fit in javascript zu sein scheinst, würde ich mich freuen, wenn du mir noch eine andere lösung nennen würdest!

"10% der welt" halte ich für stark übertrieben. wenn es 2% sind, wäre das schon sehr sehr viel. auf meiner homepage sind es nicht einmal 1% und dabei werden auch die bots und spider der suchmaschinene gezählt, die jeden tag kommen und sicherlich kein javascript unterstützen.

badbandit · registriert: 17-04-2006

so, problem gelöst

deine vorlage funktionierte ja auch ohne den zusatz im body-tag. dein weg ist auf jeden fall sehr sinnvoll und ich werde ihn auf jeden fall verwenden, falls diese funktion einmal auf allgemein zugänglichen homepages zum einsatz kommen sollte.

danke dir noch einmal für deine hilfe!!!

grinny · registriert: 02-05-2006

Hallo,

ich arbeite gerade an einem ähnlichen Projekt und muss auch zugeben wirklich keine JS-Leuchte zu sein...
Ich habe jetzt noch zwei Probleme, die ich nicht lösen konnte:

1. der erste Absatz soll geöffnet sein, wenn ich die Seite aufrufe
2. ein Plus und Minus vor den Links soll je nach Status davor erscheinen.

Es wär toll, wenn sich jemand finden ließe um mir ein paar Hinweise zu geben!

Vielen Dank!