Saber cuando AJAX ha terminado

[DoHITB]

Buenas!

Tengo unas funciones (externas, que no son propias de mi hosting) que lanzan una rutina AJAX, la cual devuelve Texto (es decir, al final hay un innerHTML = texto).

Posteriormente tengo que acceder a un elemento de lo retornado por AJAX.

El problema está en que no puede acceder al elemento porque cuando llega a esa línea de JS todavía no ha cargado el AJAX, no se si me explico.

Entonces le puse un setTimeout, para esperar que acabe el AJAX y que funcione bien.

El problema que le veo a esto es que si yo tengo mi conexión de internet a 30mb, con un timeout bajo me saldrá, pero alguien que tenga 1mb quizás no...

Entonces, cómo puedo hacer para saber cuándo el AJAX ha terminado?

Probé hacer un bloque Try/Catch en un bucle, así

Código:

function postAJAX(){
  b = false;

  while(!b){
    b = true;

    try{
      //cosas
    }catch(err){
      b = false;
    }
  }
}

pero claro, se me quedaba la web clavada en el bucle...

Mi idea es hacer algo así como: "pruebo de lanzar con un setTimeout, si falla vuelve a hacerlo; hasta que funcione", pero no sé si se puede "dormir" la rutina o algo así para que no se quede en un bucle infinito...

Gracias!

[emprear]

Si me fijo en el título la respuesta parece muy simple

Código Javascript:

if(peticion_http.readyState == 4) {
      if(peticion_http.status == 200) {
        alert(peticion_http.responseText);
      }
    }
 

El valor de la propiedad readyState determina el estado de la petición, y 4 te indica que terminó.
Ahora

El problema está en que no puede acceder al elemento porque cuando llega a esa línea de JS todavía no ha cargado el AJAX, no se si me explico.

Ahi, ya no entiendo, cuál es la linea de js?, y con elemento, a que te refirís? supongo que a
elemento.innerHTML = texto

Explicate un poco más

SAludos

[DoHITB]

Te explico.

Primero se llaman a unas rutinas AJAX que definen unas variables.
Después se llama a una rutina AJAX que formatea un texto.

Finalmente necesito cambiar un simple color del texto que devuelve.

Digamos así:

Código:

externoAJAXvariables(){//define unas variables; digamos v1 y v2};

externoAJAXtexto(v1, v2){//recibe v1 y v2, y me devuelve un texto, en el cual hay un div con un ID que conozco y que quiero cambiar mediante JS};

propioJScambiaColor(){
document.getElementById(id).style.backgroundColor='#123546';
};

Entonces, si la ejecución la hago sin pausas me falla ya que llama a la segunda rutina cuando la primera aún no ha terminado (y por tanto las variables no están definidas y me da error de JS).

Del mismo modo, se lanza la tercera función sin que esté la segunda completa, por lo que más de lo mismo.

Así, tengo hecho esto:

Código:

externoAJAXvariables();
window.setTimeout("externoAJAXtexto(), 1200);
window.setTimeout("propioJScambiaColor(), 2000);

A mí en mi navegador me funciona, y en general funciona bien. El problema es que no sé si con una conexión lenta bastarán 1,2 segundos, por eso comentaba lo de esperar a que terminara.

Espero que ahora sí quede algo más claro.

Saludos!

[emprear]

A ver, la lectura del documento por parte del navegador es secuencial, podés en todo caso determinar que evento dispará la ejecución, no es lo mismo

Código HTML:

<script>
document.getElementById('x');
</script>
<div id="x"></div>
 

Error , porque tu script está intentando identificar un elemento antes de que la página sea cargada

Código HTML:

<div id="x"></div>
<script>
document.getElementById('x');
</script>
 

Correcto, ya que el elemento de id x ya se cargó

Código HTML:

<script>
functio carga(){
document.getElementById('x');
}
 
window.onload = carga;
</script>
<div id="x"></div>
 

Correcto también, ya que si bien la función está definida antes, no se ejecutará hasta que el documento sea cargado

La aplicación de una demora mediante setTimeout(), no te modifica nada en este caso, porque aunque la apliques a una función específica, lo único que hace es demorar todo.
Lo que si observo, es que en

Código Javascript:

propioJScambiaColor(){
document.getElementById(id).style.backgroundColor='#123546';
};
 

hay un error (bueno, no sé si lo pusiste como ejemplo, o lo tenés exactamente asi) ya que estás haciendo getElementById(id). utilizando una variable, que no es pasada a la función propioJsCambiaColor()

Saludos

[DoHITB]

Cierto, cierto... lo estuve pensando y conseguí que funcionara. También he creado un sistema para no tener que esperar tanto usando cookies (primero creo las variables, espero, las pongo en una cookie y luego le envío los datos. En las siguientes ejecuciones ya no hace falta crear las variables porque están en la cookie).

Lo que comentas del fallo, lo sé. Lo he puesto así para que veas que llamo a un id "externo".

Saludos!