Checkbox
Hallo allerseits,
bin absoluter Neuling, was Javascript angeht.
Ich möchte folgendes: Beim Klick auf eine Checkbox sollen weitere Auswahlmöglichkeiten erscheinen. Also irgendwie so:
<input type="checkbox" name="check" onclick="document.write('???');" checked>
Kann man das irgendwie so machen? Oder muss man das anders machen?
Gruß,
Üsch
Antwort schreiben
Antwort 1 von Supermax vom 31.05.2019, 18:23 Options
im Prinzip funktioniert das schon so, allerdings solltest du alles was bei onClick ausgeführt werden soll in eine funktion packen und statt document.write besser die Methoden des DOM (Document Object Model) verwenden.
z.b.
function checkboxClick(sender) {
zusatzContent = document.getElementById('content');
zusatzContent.innerHTML = 'irgendwas';
}
der entsprechende HTML-Code könnte dann z.B. so aussehen
<input type="checkbox" name="check" onClick="checkboxClick(this);" >
<div id="content"><!-- hier kommt dann der Content her --></div>
Antwort 2 von Uesch vom 01.06.2019, 17:35 Options
Oki, vielen Dank!
Antwort 3 von Uesch vom 02.06.2019, 13:16 Options
Und was mache ich, wenn ich nicht nur Text da haben will, wo 'irgendwas' steht, sondern eine Pop-Up Box?
Antwort 4 von Uesch vom 02.06.2019, 13:22 Options
ach! Und wie kriegt man das ganze bei erneutem Klick wieder weg?
Gruß,
Üsch
Antwort 5 von Supermax vom 02.06.2019, 13:36 Options
Du kannst alles was in dem Popup erscheinen soll in einen div-Container mit style="visibility:hidden;" einbauen und in dem JavaScript dann mit
zusatzContent.style.visibility = 'visible';
sichtbar machen bzw. mit
zusatzContent.style.visibility = 'hidden';
wieder verbergen. In diesem DIV kannst du alle HTML-Elemente einsetzen, die laut Standard innerhalb eines DIVs erlaubt sind, also z.B. auch Formularelemente.
Antwort 6 von Uesch vom 02.06.2019, 14:03 Options
Gut danke, das Öffnen klappt soweit, aber ich weiß nicht wie man es wieder schließen lassen kann.
Hab jetzt:
<input type="checkbox" name="check" onClick="zusatzContent.style.visibility = 'visible';">
Wie sag ich ihm jetzt, dass er beim zweiten Klick, es wieder schließen soll?
Antwort 7 von rfb vom 02.06.2019, 21:48 Options
indem du es in eine Funktion packst, die zuerst den aktuellen Status prüft und entsprechend agiert!
Antwort 8 von Uesch vom 02.06.2019, 22:41 Options
Hatte ich schon erwähnt, dass ich mich mit Javascript nicht auskenne?
Antwort 9 von rfb vom 02.06.2019, 23:57 Options
Zitat:
mit Javascript nicht auskenne
nein! Du erwähntest, dass du
absoluter Neuling bist - das impliziert nicht zwingend, dass du gar keine Ahnung hast.
Sowas wie
onClick="zusatzContent.style.visibility = (zusatzContent.style.visibility=='visible') ? 'hidden' : 'visible'; "
könnte u.U. reichen.
Das ist allerdings weder schön noch besonders wartungsfreundlich, da der Quellcode durch sowas sehr unübersichtlich wird. Genau genommen ist das also Pfusch. Informiere dich lieber bei
SelfHTML wie das mit JavaScript-Funktionen richtig geht!