javscript onLoad über AJAX nicht möglich?
conrad
- javascript
0 Steel0 steckl0 Sven Rautenberg
hallo,
ich habe eine datei die heißt index.html
auf dieser seite mache ich mittels onClick einen AJAX Request und rufe datei ausgabe.html auf.
in der ausgabe.html steht im body folgendes geschrieben:
<body onLoad="letsgo();">
rufe ich die ausgabe.html per hand auf, wird die letsgo(); fkt. ausgeführt, jedoch nicht über die index.html.
warum?
was muß ich ändern?
oder kann ajax das nicht?
hier noch mein AJAX Request code:
HTML-Code:
<script language="javascript" type="text/javascript">
function ahah(url, target) {
document.getElementById(target).innerHTML = ' Daten laden ...';
if (window.XMLHttpRequest) {
req = new XMLHttpRequest();
} else if (window.ActiveXObject) {
req = new ActiveXObject("Microsoft.XMLHTTP");
}
if (req != undefined) {
req.onreadystatechange = function() {ahahDone(url, target);};
req.open("GET", url, true);
req.send("");
}
}
function ahahDone(url, target) {
if (req.readyState == 4) { // only if req is "loaded"
if (req.status == 200) { // only if "OK"
document.getElementById(target).innerHTML = req.responseText;
} else {
document.getElementById(target).innerHTML=" AHAH Error:\n"+ req.status + "\n" +req.statusText;
}
}
}
function load(url) {
ahah(url,"maincontent");
}
</script>
der restliche inhalt der ausgabe.html wir ohne probleme angezeigt und dargestellt.
die ausgabe.html sieht folgendermaßen aus:
<script language="javascript" type="text/javascript">
<!--
function playmusic_app()
{
parent.footer.location.href="klatschen.php";
}
function letsgo()
{
document.test.cell1.src="alwaystwo.gif";
setTimeout('cell2()',900)
}
function cell2()
{
document.test.cell2.src="alwaystwo2.gif";
setTimeout('cell3()',1100)
}
function cell3()
{
document.test.cell3.src="alwaystwo3.gif";
setTimeout('cell4()',1100)
}
function cell4()
{
document.test.cell4.src="alwaystwo4.gif";
document.test.cell5.src="all.gif";
/*document.test.cell6.src="all.gif";
document.test.cell7.src="all.gif";*/
setTimeout('zufallcell5()',6999)
}
function zufallcell5()
{
var a = 0;
a = Math.random();
a *= 6;
a = Math.ceil(a);
setTimeout('zufallcell6()',4000)
document.test.cell5.src=a + ".gif";
document.test.cell6.src="all.gif";
}
function zufallcell6()
{
var b = 0;
b = Math.random();
b *= 9;
b = Math.ceil(b);
setTimeout('zufallcell7()',3500)
document.test.cell6.src=b + ".gif";
document.test.cell7.src="all.gif";
}
function zufallcell7()
{
var c = 0;
c = Math.random();
c *= 9;
c = Math.ceil(c);
document.test.cell7.src=c + ".gif";
playmusic_app()
}
letsgo();
-->
</script>
</head>
<body onLoad="letsgo();">
danke für hilfe
Hi
Wenn ich mich nicht taeusche, ist der Body doch schon lange geladen. Was sollte also ein nachtraegliches onload noch bringen?
Hi,
function load(url) {
ahah(url,"maincontent");
}
Was ist "maincontent"?
letsgo();
Hier rufst du die Funktion schon vor dem eigentlichen laden der Seite auf, aber da ist wohl nicht dein Fehler.
-->
</script>
</head><body onLoad="letsgo();">
Bei readystate == 4 sollte schon alles fertig geladen sein, wenn ich das richtig verstanden habe. Also müsste onload vom Body auch schon vorbei sein.
mfG,
steckl
Moin!
in der ausgabe.html steht im body folgendes geschrieben:
<body onLoad="letsgo();">
AJAX kennt keinen Body (das X im Namen steht für XML, und in XML ist kein Element <body> definiert), also gibts auch kein onload-Event.
Das macht aber nichts, weil der asynchrone Teil von Ajax ja dafür sorgt, dass Javascript genau dann ausgeführt wird, wenn (unter anderem) der Ajax-Request vollständig ausgeführt wurde. Und das reicht ja vollkommen aus: Du kriegst "onAJAXload" die Kontrolle über den Programmfluß in deiner onreadystatechange-Funktion, und mußt da nur noch passend agieren.
Bedenke aber, dass das Nachladen von Javascriptcode in unterschiedlichen Browsern durchaus problematisch sein kann. Die Dokumentation des Frameworks jQuery spricht davon, dass z.B. der IE <script>-Inhalt ignoriert, wenn vorher keine anderen Zeichen kommen.
Die Frage ist aber eigentlich: Wozu brauchst du hier bloß AJAX? Und warum so viele sinnlose Daten? Deine ganzen Funktionen ließen sich perfekt schon in der Ursprungsseite einbinden. Würdest du Parameter in Funktionsaufrufen nutzen, müßtest du auch nicht cell2, cell3, cell4 etc. schreiben, sondern würdest genau eine Funktion "delayPicChange" haben, der du drei Parameter "pic", "src" und "delay" übergibst, um ein Bild nach einer Wartezeit auszutauschen. Das allein erfordert noch keinerlei AJAX.
- Sven Rautenberg