Baumstrukturmodus | Brettstrukturmodus

***e-phy*** · (Dieser Beitrag wurde zuletzt bearbeitet: 08.07.2006 16:08 von e-phy.)

Moin zusammen,
ich habe hier mein erste kleines AJAX-Script zusammengebastelt.
Es stellt eine kleine Uhr da, die einmal über einen Intervall ständig aktualisiert wird, aber auch von Hand durch einen Link aktualisiert werden kann.

Ihr benötigt neben dem HTML-Quellcode auch noch eine PHP-Datei mit folgendem Inhalt ( Ich habe sie hallo.php im Code genannt - wenn ihr nichts ändern wollst, müsst ihr dies entsprechend auch tun!)

PHP-Code:

echo date("H:i:s",time()); 

Und schließlich diese valide HTML Datei:

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"

        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" lang="en">

<head><title>Script 1 - AJAX Test</title>

    <script type="text/javascript">

        function Refresh()

        {

            var req =(window.XMLHttpRequest) ?    new XMLHttpRequest() :((window.ActiveXObject)? new ActiveXObject("Microsoft.XMLHTTP"): false);

            req.open("GET","hallo.php",true);

            req.onreadystatechange = function()

            {

                if (req.readyState == 4)

                {

                    if (req.status == 200)

                    {

                        var d = document.getElementById("hallo")

                        var e = document.getElementById("button")

                        window.setTimeout("Refresh()", 5000);

                        e.innerHTML = "Uhrzeit aktualisieren";

                        d.innerHTML = req.responseText;

                    }

                }

            }

            req.send(null)

        }

        window.onload = Refresh();

    </script>

</head>

<body>

<div id="hallo"></div>

<a href="javascript:Refresh('')" id="button"></a> <!--Achtung! Blank vor script entfernen!!! -->

</body>

</html>

Ihr könnt damit herumexperimentieren wie ihr wollt. Bei Fragen einfach hier melden. Viel Spaß damit.

Vielleicht ein Tipp am Rande: Bei mir ist der Apache bei einer Frequenz von einer Millisekunde in die Knie gegangen. Sah aber gut aus der Countup *g*

***Freshmaker_01*** · 08.07.2006, 14:59

Hier mal die demo dazu Smile

http://www.web-mafia.net/uhr.htm

***e-phy*** · 08.07.2006, 15:29

Aus mir unerklärlichen Gründen wird in der Ausgabe hier javascript getrennt geschrieben. daher funktioniert der link nicht!

<a href="jRefresh('')" id="button"></a>

muss eigentlich:

<a href="jRefresh('')" id="button"></a>

heißen. also ohne das blank vor script!

***Freshmaker_01*** · 08.07.2006, 15:51

jo, jetzt funktioniert es ^^

Möglicherweise verwandte Themen...
Thema:		Verfasser	Antworten:	Ansichten:	Letzter Beitrag
	Meine erste Ajax Spielseite	dino	1	357	18.06.2007 18:24 Letzter Beitrag: Para
	Ajax - Scriptsammlung [Leithtread]	e-phy	0	351	21.10.2006 09:49 Letzter Beitrag: e-phy
	Einführung in AJAX - Tutorial	Sam Fisher	16	1.922	03.07.2006 19:32 Letzter Beitrag: ~Christian
	AJAX - Was ist das eigentlich?	e-phy	6	673	03.06.2006 10:08 Letzter Beitrag: ~Christian