AJAX - Kompatiblitätsproblem

darthdespotism

Bei ein paar AJAX - Experimenten bin ich auf ein Kompatiblitätsproblem gestoßen (Gecko + Firefox <-> Rest der Welt). Die Source sieht so aus:

<!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" xml:lang="de" lang="de">
<head>
	<title> Minimalbeispiel </title>
	<script type="text/javascript">
	<!--
		function load(what)
		{
				var req = null;

				try
				{
					req = new XMLHttpRequest();
				}
				catch(ms)
				{
					try
					{
						req = new ActiveXObject("Msxml2.XMLHTTP");
					}
					catch(nonms)
					{
						try
						{
							req = new ActiveXObject("Microsof.XMLHTTP");
						}
						catch (failed)
						{
							req = null;
						}
					}
				}

				if (req == null)
					alert("Konnte Ajax nicht initialisieren!");

				req.open("GET", "http://christoph.sf-ogame.de/test/ajax/" + what, true);

				req.onreadystatechange = function()
				{
					if (req == null)
						return true;
					if (req.readyState == 4)
					{
						if (req.status != 200)
						{
							alert("Fehler: " + req.status);
						}
						else
						{
							document.getElementById('sec').innerHTML = req.responseText;
						}
					}
					else
					{
						return false;
					}
					req = null;
				}

				req.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");

				req.send(null);
		}
	-->
	</script>
</head>
<body>
	<div id="sec">Noch leer</div>
	<ul id="menulist">
		<li style="cursor: pointer;text-decoration: underline;" onclick="load('1.txt')">Eins</li>

		<li style="cursor: pointer;text-decoration: underline;" onclick="load('2.txt')">Zwei</li>
		<li style="cursor: pointer;text-decoration: underline;" onclick="load('3.txt')">Drei</li>
		<li style="cursor: pointer;text-decoration: underline;" onclick="load('4.txt')">Vier</li>
		<li style="cursor: pointer;text-decoration: underline;" onclick="load('5.txt')">F&uuml;nf</li>
	</ul>
</body>
</html>

Das ganze gibt's auch Live unter http://christoph.sf-ogame.de/test/ajax

Das Problem:
* Opera: Zuerst tut sich überhaupt nichts, irgendwann liefert er eine leere Seite
* Konqueror: Der Text wird nicht in das <div> geladen sondern ersetzt den <body> Inhalt.

Safari (3.0.3) funktioniert sonderbarerweise.

Ben04

Funktionier bei mir mit

Firefox 2.0.0.6
Opera 9.00 Beta
IE 6 sp2

Andere Browser habe ich nicht ausprobiert.

AFAIK innerHTML ist IE JS und kein Standard. Die meisten Browser dürften es unterstützen, aber jeder auf seine Art.

DEvent

Bei mir geht gar nichts. Habe Opera 9.23. Werden auch keine Fehler angezeigt in der Fehler-Konsole. Ich selbst baue grade Ajax-Seite auf und da geht alles normal.
Ich mache das so:

document.http = new XMLHttp();
    document.http.sendRequest("test.php?" + actionstr, readyStateChange, "");

function readyStateChange()
{
    var req = document.http.req;
    if ( req.readyState == 3 || req.readyState == 4 )
    {
        // ...
    }
}

XMLHttp liefert mir einen XMLHttpRequest oder Microsof.XMLHTTP, je nachdem welcher Browser.

Ups XMLHttp ist doch komplizierter:

function XMLHttp()
{
    this.req = this.getXMLHttpRequest();
}

XMLHttp.prototype.getXMLHttpRequest = function()
{
    if ( window.XMLHttpRequest )
    {
        return new XMLHttpRequest();
    }
    if ( typeof ActiveXObject != "undefined" )
    {
        return new ActiveXObject("Microsoft.XMLHTTP");
    }
    alert("No XMLHttp found!");
}

XMLHttp.prototype.sendRequest = function(url, handler, params)
{
    if ( this.req )
    {
        this.req.onreadystatechange = handler;
        this.req.open("get", url + "?" + params, true);
        this.req.send(null);
    }
}

darthdespotism

Das Problem war schlicht der Name der funktion

load()

wollen Opera & Konqueror nicht (ist da scheinbar schon definiert für irgendwas) ein Umbenennen hat das Problem gelöst ...