nicht angemeldet
AJAX responseText in IE -- merkwürdig
Hallo zusammen. Ich benötige Hilfe bei einem sehr merkwürdigem Verhalten von IE 7 bei AJAX Responses.
Mein Problem:
Ein kleines Menü auf meiner Homepage testet AJAX mit PHP und Perl.
http://http://isonthenet.de/menuselect/menuselect_ajax.htm
Dies funktioniert einwandfrei in Firefox 2.
In IE 7 kommt es zu dem merkwürdigen Inhalten der Variable "importdat".
Bitte die drei Zeilen beachten, wenn diese Variable in das HTML geschrieben wird. Kurz vorher und nachher. Ist das nicht seltsam?
Wenn ich die beiden Alerts weglasse, kommt im IE 7 "data not available".
Siehe Source:
<html>
<head>
<!-- Style access for IE -->
<script src="./scriptaculous/lib/prototype.js" type="text/javascript"></script>
<script src="./scriptaculous/src/scriptaculous.js" type="text/javascript"></script>
<script type="text/javascript">
//menuselect
var usualbg = '\#91A2B8';
var overbg = '\#ABBED6';
var activebg = '\#AFCFD6';
var menuitems = 3;
function loadselect(but){
idstring = 'menu'+but;
Element.setStyle(idstring, {backgroundColor:activebg} );
for (i=1;i<=menuitems;i++){
idstring = 'menu'+i;
y = document.getElementById(idstring);
if (i == but){y.setAttribute('onmouseout', 'Element.setStyle(this, {backgroundColor:activebg});');}
else {
Element.setStyle(idstring, {backgroundColor:usualbg} );
y.setAttribute('onmouseout', 'Element.setStyle(this, {backgroundColor:usualbg});');
}
}
z = document.getElementById("loadselect");
switch (but) {
case 1:
content="./content0.cgi?menu="+but;
break;
case 2:
content="content1.php?menu="+but;
break;
case 3:
content="content0.cgi?menu="+but;
break;
default:
content='Content error, check code.';
break;
}
// Ajax HttpRequest for getting script data
dataSource = content;
importdat = '';
var XMLHttpRequestObject2 = false;
try {
XMLHttpRequestObject2 = new ActiveXObject('MSXML2.XMLHTTP');
} catch (exception1) {
try {
XMLHttpRequestObject2 = new ActiveXObject('Microsoft.XMLHTTP');
} catch (exception2) {
XMLHttpRequestObject2 = false;
}
}
if (!XMLHttpRequestObject2 && window.XMLHttpRequest) {
XMLHttpRequestObject2 = new XMLHttpRequest();
}
if(XMLHttpRequestObject2) {
XMLHttpRequestObject2.open('GET', dataSource);
XMLHttpRequestObject2.onreadystatechange = function()
{
if (XMLHttpRequestObject2.readyState == 4 &&
XMLHttpRequestObject2.status == 200) {
importdat = XMLHttpRequestObject2.responseText;
}
else {importdat = 'data not available';}
}
XMLHttpRequestObject2.send(null);
}
alert(importdat);
z.innerHTML = importdat;
alert(importdat);
}
</script>
</head>
<body>
<table align="center" border="1" height="300px" style="border-collapse:collapse;text-align:center;font-face:verdana;font-weight:bold;font-size:12px;">
<tr height="40px">
<script type="text/javascript">
for (i=1;i<=menuitems;i++){
document.write('<td width="50px" id="menu'+i+'" onclick="loadselect('+i+');" style="border:thin solid black; cursor:pointer;background-color:'+usualbg+';" onmouseover="Element.setStyle(this, {backgroundColor:overbg} );" onmouseout="Element.setStyle(this, {backgroundColor:usualbg} );">'+i+'</td>');
}
</script>
</tr>
<tr>
<td colspan=4 id="loadselect"></td>
</tr>
</table>
</body>
</html>
-
Hallo slafochmed,
if (XMLHttpRequestObject2.readyState == 4 &&
XMLHttpRequestObject2.status == 200) {importdat = XMLHttpRequestObject2.responseText;
}
else {importdat = 'data not available';}
}
XMLHttpRequestObject2.send(null);
}
alert(importdat);
z.innerHTML = importdat;
alert(importdat);versuch es mal hiermit:
if (XMLHttpRequestObject2.readyState == 4 && XMLHttpRequestObject2.status == 200) { importdat = XMLHttpRequestObject2.responseText; alert(importdat); z.innerHTML = importdat; alert(importdat); } else {importdat = 'data not available';} } XMLHttpRequestObject2.send(null); }Der IE ist einfach... etwas "besonderes". Es ist nicht immer ganz nachzuvollziehen, wie er wann und wo und in welcher Reihenfolge was abarbeitet -.- besonders wenns um dom:loaded geht.
Noch ein kleiner Tipp:
z = document.getElementById("loadselect");
kann auch so aussehn: z = $("loadselect");
Da du ja Prototype benutzt. Es macht deinen Code kleiner *g*
Viele Grüße,
Jurik-
Einfach und effektiv!
Vielen Dank Jurik, das löst mein Problem. :)Ich bin gerade dabei eine javascript-DOM-flexible Internetseite IE-tauglich zu machen. Dabei kam ich auf scriptaculous, welches das prototype framework beinhaltet.
An deine beschriebene Schreibweise werde ich mich dann in Zukunft gewöhnen, zuerst muss ich aber alle
IrgendeinHTML_Element.style.einStyle = irgendwas
mit der crossbrowser-scriptaculous funktion
Element.setStyle({style:styleeigenschaft});
umschreiben...Kann nicht jemand mal einen Virus schreiben, der den IE ausmerzt? Vielleicht sollte man mal eine internationale Spendenaktion für sowas machen. hehehehe
-
-
Hi,
Dies funktioniert einwandfrei in Firefox 2.
Das wundert mich; bzw. es muss m.E. reiner Zufall sein (Ressource bereits gecached o.ae.).
In IE 7 kommt es zu dem merkwürdigen Inhalten der Variable "importdat".
Bitte die drei Zeilen beachten, wenn diese Variable in das HTML geschrieben wird. Kurz vorher und nachher. Ist das nicht seltsam?Was soll daran seltsam sein?
Du wartest die Ausfuehrung des XMLHttpRequest gar nicht ab, sondern gehst gleich nach dem Absenden von diesem davon aus, die Daten muessten "da" sein.Wenn ich die beiden Alerts weglasse, kommt im IE 7 "data not available".
Der erste alert verzoegert deine weitere Script-Abarbeitung offenbar lange genug, um im Hintergrund den AJAX-Request fertig werden zu lassen.
Du scheinst dir der Bedeutung des ersten "A" im Namen AJAX noch nicht bewusst zu sein.
MfG ChrisB
--
"The Internet: Technological marvel of marvels - but if you don't know *what* you're lookin' for on the Internet, it is nothing but a time-sucking vortex from hell."