Marc: AJAX und IE (Internet Explorer)

Hallo,

ich habe ein Problem mit einer AJAX Chatanwendung. So sieht der Code im Moment aus:
<script type="text/javascript" src="includes/js_fat.js"></script>
<script language="javascript">

var current_class = 'row2';
var counter = 0;
var ChatActionurl = "{view_shoutbox.U_ACTION}";

var lastID = -1; //initial value will be replaced by the latest known id
window.onload = initJavaScript;

function initJavaScript()
{
 if(document.forms['chatForm'])
 {
  document.forms['chatForm'].elements['chatbarText'].setAttribute('autocomplete','off'); //this non standard attribute prevents firefox' autofill function to clash with this script
  checkStatus(''); //sets the initial value and state of the input comment
 }
 receiveChatText(); //initiates the first data query
}

//initiates the first data query
function receiveChatText()
{
 if (httpReceiveChat.readyState == 4 || httpReceiveChat.readyState == 0)
 {
   httpReceiveChat.open("GET",ChatActionurl + '?lastID=' + lastID + '&rand='+Math.floor(Math.random() * 1000000), true);
    httpReceiveChat.onreadystatechange = handlehHttpReceiveChat;
   httpReceiveChat.send(null);
 }
}

//deals with the servers' reply to requesting new content
function handlehHttpReceiveChat()
{
  if (httpReceiveChat.readyState == 4)
 {
  results = httpReceiveChat.responseText.split('---'); //the fields are seperated by ---
  if (results.length > 2)
  {
   // Check that the last message wasn't printed before.
   if(lastID < results[results.length-5])
   {
    // Goes through the result one message at a time
    for(i=0;i < (results.length-1);i=i+5)
    {
     // Insert the new content into the page
     if(lastID < results[i+1])
     {
      insertNewContent(results[i+2],results[i+3],results[i+4] ,lastID);
     }
    }
    lastID = results[results.length-5];
   }
    }
    setTimeout('receiveChatText();', 4000); //executes the next data query in 4 seconds
  }
}

function insertNewContent(liName, liText, liTime, last_id)
{
 // Row Id
 var id = 'row_'+counter;

// Get a reference to the table
  var tableRef = document.getElementById("outputList");

// Insert a row in the table at row index 0
  var newRow   = tableRef.insertRow(0);

// Put some attributes to the row
 newRow.setAttribute('id', id);
 if(current_class == "row2")
 {
  newRow.style.backgroundColor = '#D9D9D9';
  current_class = "row1";
 }
 else
 {
  newRow.style.backgroundColor = '#CCCCCC';
  current_class = "row2";
 }

// Insert 2 cells in the row
  var newCell  = newRow.insertCell(0);
 var newCell2  = newRow.insertCell(1);

// Put some attributes to the rows
 newCell.setAttribute('width', 110);

// Append a text node to the cell
 newCell.innerHTML = '<span class="name"><b>'+liName+'</b><br /><i>'+liTime+'</i></span>';
 newCell2.innerHTML = '<span class="postbody" style="width: 510px; overflow: hidden;">'+liText+'</span>';

// Add 1 to counter
 counter++;

// Fade effect
 // We don't want to fade the first pack of messages
 if(last_id != -1)
 {
  Fat.fade_element(id, 30, 2000, '#666666');
 }
}

//stores a new comment on the server
function sendComment()
{
 currentChatText = escape(document.forms['chatForm'].elements['chatbarText'].value);
 if (currentChatText != '' & (httpSendChat.readyState == 4 || httpSendChat.readyState == 0))
 {
  param = 'c='+ currentChatText;
  httpSendChat.open("POST", ChatActionurl, true);
  httpSendChat.setRequestHeader("Content-type","application/x-www-form-urlencoded");
  httpSendChat.onreadystatechange = handlehHttpSendChat;
  httpSendChat.send(param);
  document.forms['chatForm'].elements['chatbarText'].value = '';
 }
 setTimeout('receiveChatText();', 500);
}

//deals with the servers' reply to sending a comment
function handlehHttpSendChat() {
  if (httpSendChat.readyState == 4) {
   receiveChatText(); //refreshes the chat after a new comment has been added (this makes it more responsive)
  }
}

//does celver things to the input and submit
function checkStatus(focusState)
{
 currentChatText = document.forms['chatForm'].elements['chatbarText'];
 oSubmit = document.forms['chatForm'].elements['submit'];
 if (currentChatText.value != '' || focusState == 'active')
 {
  oSubmit.disabled = false;
 }
 else
 {
  oSubmit.disabled = true;
 }
}

//initiates the XMLHttpRequest object
//as found here: http://www.webpasties.com/xmlHttpRequest
function getHTTPObject()
{
  var xmlhttp;
  /*@cc_on
  @if (@_jscript_version >= 5)
    try {
      xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
    } catch (e) {
      try {
        xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
      } catch (E) {
        xmlhttp = false;
      }
    }
  @else
  xmlhttp = false;
  @end @*/
  if (!xmlhttp && typeof XMLHttpRequest != 'undefined')
 {
    try
  {
      xmlhttp = new XMLHttpRequest();
    }
  catch (e)
  {
      xmlhttp = false;
    }
  }
  return xmlhttp;
}

// initiates the two objects for sending and receiving data
var httpReceiveChat = getHTTPObject();
var httpSendChat = getHTTPObject();
</script>

Derzeit schaut es so aus, dass im ersten Moment alles funktioniert. Egal welcher Browser, der Chat läuft und läuft, aber per Zufall kommt es dann dazu, dass der IE sich aufhängt.. also mehr das Script. Ich sende die Nachricht ab, aber keine neue wird dargestellt. Der 2. Versuch eine Nachricht abzusenden resultiert dann so, dass der Text im Formular stehen bleibt und nichts weiter passiert. Der Chat selbst läuft aber weiter. Die neuen Nachrichten anderer User werden weiterhin dargestellt und laufen weiter, als ob nichts wäre.

Da dieses Problem dummerweise per Zufall auftaucht, aber im Schnitt bei ca. jedem 30 Post ist es natürlich ziemlich nervenaufreibend, die Seite andauernd zu aktualisieren.

In der angegeben URL könnt ihr den Chat öffnen und einsehen, aber als Gast nicht posten. Nur um eine gewisse Vorstellung von dem Script zu erhalten.

Gruß
Marc

  1. Hallo,

    das Problem habe ich mit meinem Chat auch ;(
    Eine Lösung habe ich aber leider auch nicht finden können - letztendlich reden wird hier über den IE ;)

    Gruß aus Berlin!
    eddi