• Das Erstellen neuer Accounts wurde ausgesetzt. Bei berechtigtem Interesse bitte Kontaktaufnahme über die üblichen Wege. Beste Grüße der Admin

[FRAGE] Inhalt im Div-Container anzeigen lassen.

Klausklee13

New member
Moin, hab vor kurzem mit JS angefangen und übe grad den grundlegenden Umgang mit Eventhändlern an einfachen Beispielen.

Ich möchte bei Anklick eines Menübuttons den Inhalt in einem Div angezeigt bekommen. Jedoch funktioniert es nicht so wie gewünscht.
Code:
<body>


            	
<div class="content">
                <ul class="menu">
    			<li>
               <a href="#" onclick="javascript:document.getElementById('test').style.visibility='visible'">Seite 1</a> 
                </li>
    			</ul>
 
	<div id="test" style="visibility:hidden; width: 550px; height: 300px;"> hi, das sollst jetzt angezeigt werden</div>
    
       
			        
</div>
            
</body>
</html>



Es wäre super wenn mir jmd helfen könnte.
 
Zuletzt bearbeitet:
Dein Code funktioniert bei mir.
Ganz wichtig bei der Entwicklung: Immer die F12 Konsole im Browser auflassen! Da werden Fehler sofort angezeigt. Dass es bei dir nicht klappt kann nur an dem nicht gezeigten Code davor oder danach liegen.

Schau mal, wie ich das vorschlage und bitte die Tipps darunter beherzigen:
HTML:
<!DOCTYPE HTML> 
<html> 
	<head> 
		<title>Test Klausklee13</title> 
		<style type="text/css">
			#test{
				visibility:	hidden;
				width:		550px;
				height:		300px;
			}
			#clicker{
				cursor:		pointer;
			}
		</style>
	</head>
	<body>
		<div class="content">
			<ul class="menu">
				<li>
					<span id="clicker" onclick="document.getElementById('test').style.visibility='visible'">Seite 1</span> 
				</li>
			</ul>
			<div id="test"> hi, das sollst jetzt angezeigt werden</div>
		</div>
	</body>
</html>

Ich empfehle dringend:
  • Einrückungen gleichmäßig machen, nicht so ein Durcheinander, das gibt extrem schlecht wartbaren Code
  • a href="#" ist sinnfrei, was soll das bewirken?
  • bei onclick="javascript: kann das Präfix javascript: vor dem Code entfallen
  • keine Inline styles verwenden sondern diese separat in einem CSS-Block oder einer externen CSS-Datei definieren, ist besser für die Wartbarkeit und wenn mal etwas geändert werden soll
 
Zurück
Oben