Gruppen

Top Gruppen: Windows 7; Windows Vista; Windows XP; Textverarbeitung; Excel; DSL; Internet Browser; E-Mail/Outlook
Betriebsysteme: Windows classik; Linux; BS-Sonstige
Software: Datenbanken; Bildbearbeitung; Audio/mp3/Video; Security/Viren; SW-Sonstige
Hardware: Mainboard/CPU; Grafikkarten; Peripherie; Laptop/Notebook; HW-Sonstiges
Netzwerk: Telefon,ISDN,Modem; W-Lan; NW-Sonstiges
Programmierung: PHP,ASP,Perl...; Java,C++...; Webseiten/HTML
Sonstiges: PC-Sonstiges; Plauderecke; SN Intern; Test

/ Forum / Webseiten/HTML

Webseiten/HTML

Fragevon Die_Alex vom 01.03.2021, 16:46 Options

Teil Abschnitt einer Seite neu laden

Moin,
Ich habe mich entschieden meine Webseite statt wie sonst immer mit Frames diesmal auf css Basis aufzubauen. Das klappt auch ganz gut, doch leider wird nun immer die gesamte Seite neu geladen wodurch das Radio bzw. noch Mp3-Player immer in den ausgangs Zustand versetzt wird. Nach einigem Googlen habe ich herausbekommen das es mit Ajax möglich ist nur die veränderten Objekte nachzuladen. Dies schein das zu sein wonach ich gesucht hatte den ich möchte eigentlich immer nur den rechen Teil der Seite verändern. Ich hatte versucht das unten angegebene Tutorial nach zubauen, leider verstehe ich nicht ganz wie das funktionieren soll.

http://www.admin-wissen.de/tutorials/eigene-tutorials/webentwicklung/ajax-tutorial

Ich habe meine Test Seite mal für euch online gestellt

http://fettlangeweile.fe.ohost.de/test/index.html

Und auch noch mal alles was momentan auf dem Server liegt in ein Zip Archiv gepackt.

http://fettlangeweile.fe.ohost.de/test/test.zip

Antwort schreiben

Antwort 1 von katy vom 01.03.2021, 16:59 Options

Ich finde auf deiner Seite kein AJAX, nur störende ohost-Werbung.

katy

Antwort 2 von Die_Alex vom 01.03.2021, 17:15 Options

Hi, ich hab noch kein Ajax eingebaut da ich nicht weiß wie ich das bewerkstelligen soll. Wenn ich alles richtig verstanden habe muss ich einen code beim clienten (meine seiten Index.html und link.html) und einen teil (z.B. ajax_loading.js) auf dem server einfügen aber ich habe keine vorstellung davon was ich wo reinschreiben muss.

lg Alex

Antwort 3 von katy vom 01.03.2021, 17:45 Options

Hi Alex,

AJAX ist JavaScript und wird deswegen ausschließlich beim Clienten ausgeführt. Auf deinem Server müssen nur die Dateien liegen, die per AJAX nachgeladen werden sollen. Das können einfachte Textdateien oder aber auch XML-Dateien sein.

Bei Galileo Computing findest du dazu Beispiele.

katy

Antwort 4 von Die_Alex vom 01.03.2021, 18:34 Options

Menno das ist aber alles ziemlich kompliziert -.- ich werde mich leider auch erst am Freitag weiter damit beschäftigen können. Am besten währe es wenn ich eine Beispiel Seite zum angucken hätte.
Ich habe mir den Bericht vom Link durchgelesen kann jedoch nicht nachvollziehen wohin die einzelnen Code Schnipsel geschrieben/gespeichert werden. Wenn ich mir den Quellcode von www.google.com ansehe erkenne ich dort leider auch keine Spur von Ajax.

trotzdem vielen dank für deine Bemühung mich aufzuklären katy

lg Alex

Antwort 5 von katy vom 01.03.2021, 20:09 Options

Hi Alex,

das JavaScript eghört immer komplett in die Seite. Auf der Galileo Computing-Seite befindet sich dies Beispiel:

<html>
<head>
<title>AJAX</title>
<script type="text/javascript"><!--
var http = null;
if (window.XMLHttpRequest) {
   http = new XMLHttpRequest();
} else if (window.ActiveXObject) {
   http = new ActiveXObject("Microsoft.XMLHTTP");
}
if (http != null) {
   http.open("GET", "datei.html", true);
   http.onreadystatechange = ausgeben;
   http.send(null);
}

function ausgeben() {
   if (http.readyState == 4) {
      document.getElementById("Ausgabe").innerHTML =
         http.responseText;
   }
}
//--></script>
</head>
<body>
HTML vom Server:
<div id="Ausgabe"></div>
</body>
</html>

Das entspricht der Seite, in die du etwas hinein laden willst (hier in den bislang leeren Bereich mit der ID Ausgabe), also deine index.html, in der auch der Player stehen soll.

Und was nachgeladen werden soll steht in der Datei datei.html:

<p>AJAX erm&ouml;glicht <i>spannende</i> Effekte</p>

Da könnte auch was anderes stehen, das erscheint dann im Bereich ID=Ausgabe.

katy

Antwort 6 von Die_Alex vom 08.03.2021, 17:10 Options

Hi, so ich hab nun wieder ein bisschen rum gesurft und eine wie ich finde fast anständige Ajax Applikation zusammen geschustert doch leider kann ich nur Bilder laden den ich finde keinen Befehl um Text oder besser Html einzubinden.

Momentan sieht meine index.php so aus:

if ($_REQUEST['link'] == 1) {
echo "<img src='images/1.gif' />";
}

Was müsste ich hier statt <img src='images/*.*gif' /> eingeben um html einfügen zu können?

Ich habe die neue Seite in das alte Verzeichnis gelegt
hier der Link
Und auch wieder alles in einem Zip-Verzeichnis zusammen gefasst
hier

Antwort 7 von Die_Alex vom 08.03.2021, 19:17 Options

Ups ich hatte ein unvollständiges Zip-Verzeichnis hochgeladen. Dies ist jetzt behoben. Außerdem habe ich eine test.html bereitgestellt die beim ausführen eines der Links im antwort div angezeigt werden soll. Währe schön wenn mir jemand möglichst einfach erklären könnte ich das zu realisieren ist ;-).

lg Alex

Antwort 8 von katy vom 08.03.2021, 20:17 Options

Hallo Die_Alex,

offensichtlich nutzt du ein Skript, dass du irgendwo im Netz gefunden hast. Stimmts? Bitte sei mir nicht böse, aber das ist mir zur Analyse zu mühselig. Ich verstehe auch nicht, was an obiger Lösung (Antwort 5) dein Problem ist, du schreibst dazu aber auch nichts.

katy

Antwort 9 von Die_Alex vom 14.03.2021, 21:10 Options

Hi,

ich kann die Lösung aus Antwort 5 nicht verwenden, da ich nicht verstehe wie ich es schaffe das der Inhalt aus der "test.html" erst dann in dem div antwort angezeigt wird nach dem auf den entsprechenden Link geklickt wurde. Ich vermutte es hat etwas mit dem Befehl

if (http != null) {
http.open("GET", "datei.html", true);
http.onreadystatechange = ausgeben;
http.send(null);
}

zu tun. Weiss aber nicht wie ich diesen in mit dem Link verbinde und zusätzlich dann noch andere Links mit anderem Inhalt einbinde. Das Skript das ich verwende funktioniert eigentlich super aber halt nur mit Bildern.

mfg Alex

Antwort 10 von Supermax vom 15.03.2021, 08:51 Options

Die Funktion "ausgeben()" ersetzt einfach den Inhalt des angegebenen Elements (im Beispiel ist das das <div id="Ausgabe"></div>) mit dem, was das mit http.open() angeforderte Dokument zurückliefert. Das kann ein einfacher Text sein oder auch komplexer HTML-Code mit weiteren DIVs, IMGs oder sogar Multimedia-Objekte mittels <object> bzw. <embed>.

Antwort 11 von katy vom 15.03.2021, 09:18 OptionsLösung

dann schreib ich's mal um:

<html>
<head>
<title>AJAX</title>
<script type="text/javascript">
function dateiholen(welche) {
var http = null;
if (window.XMLHttpRequest) {
   http = new XMLHttpRequest();
} else if (window.ActiveXObject) {
   http = new ActiveXObject("Microsoft.XMLHTTP");
}
if (http != null) {
   http.open("GET", welche, true);
   http.onreadystatechange = function() {
    if (http.readyState == 4) {
       document.getElementById("Ausgabe").innerHTML = http.responseText;
     }
   }
   http.send(null);
 }
}
</script>
</head>
<body>
HTML vom Server:
<div id="Ausgabe"></div>
<ul>
<li><a href="datei1.htm" onclick="dateiholen(this.href);return false">Datei 1</a></li>
<li><a href="datei2.htm" onclick="dateiholen(this.href);return false">Datei 2</a></li>
<li><a href="datei3.htm" onclick="dateiholen(this.href);return false">Datei 3</a></li>
</ul>
</body>
</html>

Du hast jetzt eine Liste mit 3 Dateien zur Auswahl, die ins DIV Ausgabe geschrieben werden.
Bitte teste mit dem Firefox, schaue in desen Fehlerkonsole und berichte, was für Fehlermeldungen kommen, falls es nicht klappen solte (ich kann Tippfehler jetzt nicht ausschließen ;-)

katy

Antwort 12 von Die_Alex vom 26.04.2021, 04:57 Options

Entschuldige das ich jetzt erst schreibe aber ich hab momentan leider nicht viel Zeit.

Mit der letzten Antwort hat es auf an hieb funktioniert vielen Dank^^ und ganz ganz liebe grüße an katy

Hinweis

Diese Frage ist schon etwas älter, Sie können daher nicht mehr auf sie antworten. Sollte Ihre Frage noch nicht gelöst sein, stellen Sie einfach eine neue Frage im Forum..