00 Stimmen

jQuery: Mehrere Elemente einblenden und ausblenden

Frage von Gast | 12.08.2016 um 14:08

Wenn ich mit JavaScript beziehungsweise jQuery ein einzelnes Element sichtbar oder unsichtbar machen möchte, kann ich einfach die Funktionen .show(), .hide() oder .toggle() benutzen und mit der ID des jeweiligen Element aufrufen, zum Beispiel $("#abc").hide() wenn ich das Element mit der ID "abc" verbergen möchte.

Nun habe ich aber das Problem, dass ich mehrere Elemente auf einmal einblenden und ausblenden möchte. Ich habe versucht, jedem Element die gleiche ID zugeben, aber das klappt leider nicht (eine ID sollte ja auch eindeutig und nicht mehrfach vergeben sein).

Was kann ich in diesem Fall tun? Wie kann ich viele Elemente auf einmal einblenden oder ausblenden?

AntwortenPositivNegativDatumStimmen
Avatar Stefan Trost
2Beste Antwort4 Stimmen

In diesem Fall würde ich die Elemente über ihre Klasse ansprechen.

Gebe einfach allen Elementen, die du auf einmal bearbeiten möchtest, die gleiche Klasse. Also zum Beispiel:

<div class="a">DIV</div>
<p class="a">Paragraph</p>
<button class="a">Button</button>

Jetzt kannst du einen jQuery-Selector formulieren, der all diese Elemente gleichzeitig anspricht:

$(".a").show();
$(".a").hide();
$(".a").toggle();

Dies würde alle Elemente mit der Klasse "a" einblenden, ausblenden oder toggeln.
12.08.2016 um 19:08

AntwortenPositiv Negativ
Avatar Eberhard Schulz
22 Stimmen

Das sollte doch bestimmt SO aussehen:

$(".a").show();
$(".a").hide(); und
$(".a").toggle();

Da doch die Klasse gemeint ist (und nicht die ID) - stimmt's ?
11.09.2017 um 20:13

Positiv Negativ
Avatar Stefan Trost
22 Stimmen

Völlig richtig, ich habe den Fehler korrigiert.

Vielen Dank für den Hinweis!
12.09.2017 um 05:41

Positiv Negativ
Antworten
Antworten

Ähnliche Themen

jQuery: Elemente einblenden und ausblenden

Tutorial | 0 Kommentare

jQuery: Ist Element vorhanden?

Tipp | 1 Kommentar

jQuery: Elemente, Bilder, Klassen etc zählen

Tipp | 0 Kommentare

Mehrere Texte gleichzeitig ersetzen

Tutorial | 0 Kommentare

PHP: Alle leeren Elemente aus String-Array entfernen

Tipp | 0 Kommentare

CSS-Stylesheets in HTML einbinden

Tutorial | 0 Kommentare

HTML: Unterschied zwischen ID und CLASS

Info | 0 Kommentare

Wichtiger Hinweis

Bitte beachten Sie: Die Beiträge auf askingbox.de sind Beiträge von Nutzern und sollen keine professionelle Beratung ersetzen. Sie werden nicht von Unabhängigen geprüft und spiegeln nicht zwingend die Meinung von askingbox.de wieder. Mehr erfahren.

Jetzt mitmachen

Stellen Sie Ihre eigene Frage oder schreiben Sie Ihren eigenen Artikel auf askingbox.de. So gehts.