nicht angemeldet
Bereiche ein- und ausblenden
Matthias ApselHallo Forum,
Ich habe auf einer Seite mehrere Bereiche (Kommentarfelder) die ich per Klick aus- und wieder einblendet. Hier mal der Code:
<html>
<body>
<script type="text/javascript">
function anzeigen(das){
if(document.getElementById(das).style.display=='none')
document.getElementById(das).style.display = 'block';
else
document.getElementById(das).style.display = 'none';
}
</script>
<table>
<tr><td>this is text</td></tr>
<tr><td>this is text too</td></tr>
<tr><td><a href='#10' onclick="anzeigen('10')">Kommentare</a></td></tr>
<tr name='10' id='10' style='display: none;'><td>this is hidden</td></tr>
<tr><td>this is text</td></tr>
<tr><td>this is text too</td></tr>
<tr><td><a href='#11' onclick="anzeigen('11')">Kommentare</a></td></tr>
<tr name='11' id='11' style='display: none;'><td>this is hidden</td></tr>
</table>
</body>
</html>
Kann ich das irgendwie steuern, dass immer nur ein hidden-Bereich zur Zeit offen ist? Also wenn ich einen Link anklicke, dass dann ein anderer offener Bereich geschlossen wird?
Ich hoffe das ist einigermassen verständlich....
lg Micha
-
Hallo,
schließe zuerst alle hidden-Bereiche und zeige anschließend nur den an, der ausgewählt wurde.
Viele Grüße
SiriPS: Denk auch mal darüber nach, den entsprechenden Elementen eine neue Klasse per JS zuzuweisen und nicht nur die display-Eigenschaft zu ändern!
-
Hallo,
schließe zuerst alle hidden-Bereiche und zeige anschließend nur den an, der ausgewählt wurde.
Viele Grüße
SiriPS: Denk auch mal darüber nach, den entsprechenden Elementen eine neue Klasse per JS zuzuweisen und nicht nur die display-Eigenschaft zu ändern!
Hallo Siri,
weia,.. eine Profiantwort ;) ich bin mit javascript leider nicht so bewandert, wie kann ich denn alle Bereiche durchlaufen und auf hidden prüfen?
Das script wird später in einer php-datei laufen, die alle kommentareinträge aus einer db holt.
Die Einträge für die hidden-Bereiche würden also überall dort wo jetzt name= und id= mit nummern festgelegt ist, eine variable nutzen ($row['ID']).LG Micha
-
Moin,
weia,.. eine Profiantwort ;) ich bin mit javascript leider nicht so bewandert, wie kann ich denn alle Bereiche durchlaufen und auf hidden prüfen?
Beispielsweise indem deine Funktion, die einen Bereich einblendet vorher alle anderen versteckt. Da du als IDs Zahlen verwendest, und du weißt, wie viele Kommentare grundsätzlich vorhanden sind, sollte das kein Problem sein. Da lässt sich prima eine For-Schleife nutzen.
Das script wird später in einer php-datei laufen, die alle kommentareinträge aus einer db holt.
Auch, wenn die Kommentare mit PHP aus einer DB geholt werden, weißt du wie viele es sind ;)
Grüße Marco
--
Ich spreche Spaghetticode - fließend. -
Hallo,
weia,.. eine Profiantwort ;) ich bin mit javascript leider nicht so bewandert, wie kann ich denn alle Bereiche durchlaufen und auf hidden prüfen?
Du könntest allen Bereichen, die hidden sind einen bestimmten Namen oder Klasse geben, und dann mit http://de.selfhtml.org/javascript/objekte/document.htm#get_elements_by_name@title=getElementsByName oder getElementsByClassName durchlaufen und auf "hidden" setzen. Beispiel.
Abschließend wie gehabt das eine Element -wie gehabt- gezielt anzeigen.
Viele Grüße
Siri -
Hallo Micha!
... ich bin mit javascript leider nicht so bewandert, wie kann ich denn alle Bereiche durchlaufen und auf hidden prüfen?
Gerade Leuten, die sich mit Javascript "nicht so gut" auskennen, würde ich die Verwendung eines Javascript Frameworks empfehlen. Und da dann das mit Abstand am häufigsten verwendete, nämlich jQuery.
Das script wird später in einer php-datei laufen, die alle kommentareinträge aus einer db holt.
Die Einträge für die hidden-Bereiche würden also überall dort wo jetzt name= und id= mit nummern festgelegt ist, eine variable nutzen ($row['ID']).Du solltest die Elemente, die später
1. auf den Klick reagieren und
2. und entsprechend eingeblendet werden sollen
"gruppieren", bspw. indem du ihnen eine gemeinsame CSS-Klasse verpasst.In jQuery baust du dann einen Event-Listener für diese Gruppe für Click ein.
Das EIn- & Ausblenden sollte übrigens auch nicht durch eine direkte (Style)Änderung der Display-Eigenschaft erfolgen, sondern vielmehr durch das Hinzufügen, bzw. entfernen einer weiteren CSS-Klasse (nur für das jeweils anzuzeigende Element).Falls du dich also für die Verwendung von jQuery entscheidest, und mit Googeln nicht weiterkommen solltest, kannst du ja hier (bitte in diesem Thread - keinen neuen aufmachen) wieder nachfragen.
Viel Erfolg!
Gruß Gunther
-
Om nah hoo pez nyeetz, Gunther!
bspw. indem du ihnen eine gemeinsame CSS-Klasse verpasst.
[...] Hinzufügen, bzw. entfernen einer weiteren CSS-Klasse
Matthias
-
-
Om nah hoo pez nyeetz, Matthias!
bspw. indem du ihnen eine gemeinsame CSS-Klasse verpasst.
[...] Hinzufügen, bzw. entfernen einer weiteren CSS-Klasse
Ja Herr Lehrer! ;-)
Natürlich hast du recht, also verzeih' bitte den "falschen" Sprachgebrauch.
Es dürfte aber trotzdem für Jedermann verständlich sein, was gemeint ist. Und das war mir hier die Hauptsache. :-PGruß Gunther
-
-
-
-
-
Hallo,
beachte, dass es für das ID-Attribut Regeln gibt, u.a. darf der Wert nur mit einem Buchstaben beginnen.
Gruss,
Worf-
Meine Herren,
beachte, dass es für das ID-Attribut Regeln gibt, u.a. darf der Wert nur mit einem Buchstaben beginnen.
Nicht so strikt in HTML5:
"The value must be unique amongst all the IDs in the element's home subtree and must contain at least one character. The value must not contain any space characters."
--
Hey Girl,
i wish you were asynchronous, so you'd give me a callback.
-
