claro eso es porque para hacerlo facil siempre mando crear un objeto xmlhttprequest con el mismo nombre. Ese es el objeto encargado de cargar los contenidos externos... si lo creo con el nombre XHR y luego creo otro con el mismo nombre me acabo de cargar al primero :P
vamos a modificarlo para que sea un array y así cada vez sea un objeto xmlhttprequest distinto y al crear uno no nos carguemos el anterior... también añado el borrar el objeto cuando lo haya pasado ya dentro del div para que no se llene la memoria de objetos inutiles.
La verdad es que esta función puede mejorarse y mucho! pero de momento creo que te valdrá.
Código:
XHR= new Array;
function cXHR(){ var XHR=false; if (window.ActiveXObject){XHR=new ActiveXObject("Microsoft.XMLHTTP");}else if(window.XMLHttpRequest){XHR=new XMLHttpRequest();}if(XHR)return XHR;else alert("Error: AJAX no funciona en su navegador actualicelo.");}
function ajax(id_div,URL_a_cargar) {
n=XHR.length;
XHR[n]=cXHR();
XHR[n].open( "GET", URL_a_cargar , true );
XHR[n].onreadystatechange=function(){
if (XHR[n].readyState==4)
if (XHR[n].status==200) { document.getElmentById(id_div).innerHTML=XHR[n].responseText; XHR[n]="";}
else if(XHR[n].status==404) alert("Error: La página llamada con AJAX no existe");
else alert("Error "+XHR[n].status+": "+XHR[n].statusText);}
XHR[n].send(null);}