• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Inhalt in Div tag laden

Status
Für weitere Antworten geschlossen.
N

nightmarevs

Neues Mitglied
Abend,
ich will eine html in ein div tag laden und habe gelesen das das nur mit javascript möglich ist. Da ich aber nur des normalen Java mächtig bin bin ich mit dieser aufgabe ein wenig überfordert. Hat jemand einen Code mit dem ich durch die onklick funktion eines hyperlinks den Inhalt eines div tags durch eine andere html seite ersetzen kann?
Gruß
nightmarevs
 
Werbung:
Das macht man nicht mit JavaScript, sondern mit einer serverseitigen Scriptsprache wie PHP und der Funktion include.
 
hmm ok dann ist das das falsche forum könntest du mir vllt. trotzdem ein kurzes beispiel posten wie ich mit include den inhalt eines buttons via hyperlink ändern kann?
 
Werbung:
Wenn ich verstanden hätte, was du vorhast, würde ich das machen. Beschreib den Ablauf mal etwas genauer.

Der Inhalt eines Buttons soll sich ändern? Also die Beschriftung? Oder meinst du einen normalen Link?
 
da habe ich mich wohl etwas ungenau ausgedrückt:

ich habe ein div tag mit der id "inhalt" dort soll der inhalt der seite rein. Auserhalb dieses div tags habe ich eine buttonleiste. Bei einem Klick auf einem dieser Buttons soll sich jetzt der Inhalt des div tags "inhalt" ändern. Dazu will ich eine neue Seite in "inhalt" laden so dass nicht immer die ganze Seite neu geladen werden muss wenn ein anderer inhalt aufgerufen wird sondern das nur dieses eine tag aktualisiert wird.

vereinfacht sieht mein code so aus:

<div id="inhalt"></div>

<a href=# on_click=(irgendwas damit inhalt ersetzt wird)>SeiteX</a>

Hoffentlich ist es jetzt ein wenig klarer
Gruß
nightmarevs
 
Das normale Verhalten eines Browsers bei einem Klick auf einen Link ist, dass eine neue Seite geladen wird. Da ändert auch PHP nichts dran. Mit PHP kannst du allerdings dynamisch Elemente in deine Seite einbinden, so dass es so aussieht, als ob sich nur der Inhalt ändert. Dafür gibt es genügend Beispiele php include - Google-Suche
 
Werbung:
schade ich dachte es währe möglich nur einzelne teile einer seite neu zu laden statt für jede unterseite das komplette gerüst.
Jedenfalls danke für die Hilfe
 
nightmarevs schrieb:
schade ich dachte es währe möglich nur einzelne teile einer seite neu zu laden statt für jede unterseite das komplette gerüst.
Jedenfalls danke für die Hilfe
Zum Vergrößern anklicken....

Hallo nightmarevs,

zuallererst musst Du Dir die Frage stellen, ob und warum es sinnvoll wäre,
nur Teile neu zu laden, da das definitiv Nachteile hat (z.B. kann ich mir kein
Lesezeichen für eine bestimmte Seite anlegen...).

Wenn es wirklich sein muss, kannst Du mit Frames oder iframes etwas ähnliches
erreichen - da informier Dich aber unbedingt über die Nachteile!

Eine andere Möglichkeit ist, Du hast alle Inhalte in einer Seite, machst aber
mittels JavaScript jeweils nur einen Teil davon sichtbar, den Rest unsichtbar...
An sowas sitze ich momentan: http://www.virtual.bplaced.net/de/glaeser/
Das geht natürlich auch nur mit Text, ohne Bild.
(falls Du die Seite mit IE6 aufrufst, wunder Dich nicht, dass die Navigation nach
einmaligem Ausführen des JavaScripts nicht mehr funktioniert: da kann mir bisher
niemand einen Tipp zur Lösung des Problems geben...)

Grüße
Bernhard
 
Mit Ajax lässt sich das am besten realisieren:
<div> als target? - Das Hilfe, HTML und Webmaster Forum
Oder mit DHTML (Den Code müsstest du noch ein wenig verändern. War eigentlich für eine Navi-Bar, aber mann kann "naviBar" durch die Sheets größer machen und den onclick-Event-Handler auf einen Button umschreiben:

HTML: 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html>
	<head>
		<title>Navibar</title>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	</head>
	<script type="text/javascript">
	var w3c;
	function init() {
	 w3c = document.documentElement;
	}
	
	function showNav(){
	document.getElementById('naviBar').style.visibility = 'visible';
	}
	
	function hideNav() {
	document.getElementById('naviBar').style.visibility = 'hidden';
	}
	</script>
	<style type="text/css">
	    body         {margin-left: 40px;}
	    #leftBorder  {background-color: #336699; width: 25px; height: 100%; position: absolute; left: 0px; top: 0px; }
	    #naviBar     {background-color: #336699; width: 150px; height: 250px; position: absolute; left: 30px; top: 100px; padding: 5px; visibility: hidden; }
	</style>
	<body onload="init()">
	<div id="leftBorder" onclick="showNav()" onclick="hideNav()"></div>
	<div id="naviBar" onklick="showNav()" onclick="hideNav()">
	<a href="http://ebay.de">Ebay</a>
	</div>
	
	</body>
</html>
 
Werbung:
Status
Für weitere Antworten geschlossen.

Neueste Beiträge

Zurück
Oben