No carga página en el div indicado

[pimby]

Hola, mi problema es, que cuando llamo a la función callPage desde la función activeTab(tab), en la primera llamada el resultado es Cargando...., en cambio en la segunda llamada carga la página indicada correctamente en el div contenido.

Desde el php se llama bien a la función activeTab(tab) por eso no la he incluido. El problema es que no entiendo por qué funciona en la segunda llamada y en la primera no... :(

Ante cualquier ayuda, gracias de antemano ;)

Código javascript:

var req;
function callPage(pageUrl, divElementId, loadinglMessage, pageErrorMessage) {
     document.getElementById(divElementId).innerHTML = loadinglMessage;
     try {
     req = new XMLHttpRequest(); /* e.g. Firefox */
     } catch(e) {
       try {
       req = new ActiveXObject("Msxml2.XMLHTTP");  /* some versions IE */
       } catch (e) {
         try {
         req = new ActiveXObject("Microsoft.XMLHTTP");  /* some versions IE */
         } catch (E) {
          req = false;
         } 
       } 
     }
     req.onreadystatechange = function() {responsefromServer(divElementId, pageErrorMessage);};
     req.open("GET",pageUrl,true);
     req.send(null);
  }
 
function responsefromServer(divElementId, pageErrorMessage) {
   var output = '';
   if(req.readyState == 4) {
      if(req.status == 200) {
         output = req.responseText;
         document.getElementById(divElementId).innerHTML = output;
         } else {
         document.getElementById(divElementId).innerHTML = pageErrorMessage+"\n"+output;
         }
      }
  }
  
/* Funcion para activar pestañas*/
function activeTab(tab){  
        
        document.getElementById("tab1").className = "";
        document.getElementById("tab2").className = "";
        document.getElementById("tab3").className = "";
        document.getElementById("tab4").className = "";
        document.getElementById("tab5").className = "";
        document.getElementById("tab"+tab).className = "current";
 
        switch(tab){
        case 1: 
            callPage('menu2_inicio.html', 'menu2', '<img src=\"loading.gif\" /> Cargando...', 'Error en la carga... <img src=\"error_caution.gif\" />');
            sleep(1);
            callPage('cont_inicio.html', 'contenido', '<img src=\"loading.gif\" /> Cargando...', 'Error en la carga... <img src=\"error_caution.gif\" />');
            break;
        case 2: 
            callPage('menu2_pacientes.html', 'menu2', '<img src=\"loading.gif\" /> Cargando...', 'Error en la carga... <img src=\"error_caution.gif\" />');
            callPage('cont_PA1.html', 'contenido', '<img src=\"loading.gif\" /> Cargando...', 'Error en la carga... <img src=\"error_caution.gif\" />');
            break;
        case 3:
            callPage('menu2_profesionales.html', 'menu2', '<img src=\"loading.gif\" /> Cargando...', 'Error en la carga... <img src=\"error_caution.gif\" />');
            callPage('cont_PR1.html', 'contenido', '<img src=\"loading.gif\" /> Cargando...', 'Error en la carga... <img src=\"error_caution.gif\" />');
            break;  
        case 4:
            callPage('menu2_historiales.html', 'menu2', '<img src=\"loading.gif\" /> Cargando...', 'Error en la carga... <img src=\"error_caution.gif\" />');
            callPage('cont_HC1.html', 'contenido', '<img src=\"loading.gif\" /> Cargando...', 'Error en la carga... <img src=\"error_caution.gif\" />');
            break;
        case 5:
            callPage('menu2_admin.html', 'menu2', '<img src=\"loading.gif\" /> Cargando...', 'Error en la carga... <img src=\"error_caution.gif\" />');
            callPage('cont_admin1.html', 'contenido', '<img src=\"loading.gif\" /> Cargando...', 'Error en la carga... <img src=\"error_caution.gif\" />');
            break;
    }   
}
 

[iandrade]

Tu problema es que usas una sola variable(req) para hacer las 2 consultas al mismo tiempo, solo por eso responde solo la segunda

[pimby]

Gracias por tu aportación iandrade.
Al final cambié el código ...