He visto un número de puestos (anexar supuestamente inmediata) los conflictos de respuestas aceptadas en este. Estamos usando JQuery 1.4 (http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js) y append() parece ser asincrónica, tal que:

Editado para mostrar código en el contexto de AJAX de devolución de llamada

 ...
 var message = $.ajax({
   type: "GET",
   url: "/getVolumes/" +  _Id,
   async: false 
 }).responseText;
 if (parseInt(message) != 0){
   var $results = $(message);
   $MAIN_DIV.append($results);
   retrieveTargets();
 }
...    
function retrieveTargets(){
  var $targets = $(".resultTargets");
}

Se ejecuta y crea la página como se esperaba, sin embargo, los objetivos de la consulta de los rendimientos nada en tiempo de ejecución. Ejecutar el mismo código en el JS console recupera los elementos como se esperaba.

Si este es el comportamiento esperado en JQuery lo que es el camino correcto para esperar hasta que anexar está terminado?

  • jQuery 1.8?? ¿como se hace?? Eres el futuro?? 🙂
  • Anexar es sincrónico, sino su llamada Ajax no lo es. Dónde está ese código? En la función de devolución de llamada de la llamada ajax?
  • Editado con la versión correcta. Apuesto a que esto iba a funcionar de la manera que yo quiero en 1.8.
  • lo que es .resultTargets? es un elemento de la respuesta de ajax? Usted podría tener acceso a él de esta manera: var objetivos = $resultados.find(‘.resultTargets’);
  • ¿Qué sucede si se coloca console.log( $MAIN_DIV.length ) justo antes de la $MAIN_DIV.append(...?
InformationsquelleAutor RSG | 2011-02-22

2 Comentarios

  1. 25

    Todos los comentarios ayudan a rastrear esta abajo. Yo estaba siguiendo un arenque rojo en la consola.
    El problema no era con la sincronicidad, fue con las siguientes líneas:

    $targets.each( function(){
      ...
      this.html();
      ...

    Necesarios para ser

    $(this).html();

    En resumen, todo el mundo estaba en lo correcto.
    Jquery append() se comporta de forma sincrónica.

  2. 10

    Probar esto, si las cosas no funcionan después de un append.

    $('#dynamic-container').append(<your-content>) ;
    setTimeout(function() {
        ...code which addresses elements inside #dynamic-container...
    },0) ;

    Más Detalles:

    • Aparentemente append es sincrónico
    • Al parecer el DOM no se actualiza de forma sincrónica, especialmente en Google Chrome, me enfrenté a este problema cuando se trata de recuperar la altura de un div después de un append
    • Mi suposición era que había navegador de actualización de los hilos que se actualiza de forma asincrónica, más comentarios sobre esto más adelante, todavía no está claro sobre cómo funcionan las cosas, pero la solución funciona en todos los casos para mí.
    • Esto es incorrecto. El navegador se encargará de la actualización de su diseño, incluso si no se visiblemente render para el usuario, cuando JavaScript petición de datos o mediciones de la DOM. (Esta es la causa de la diseño de la trilla.)
    • Ok, el render hilos parte es mi suposición acerca de cómo el navegador se encarga de las actualizaciones de IU. Me enfrenté a este problema en mi código, y se fija mediante la solución anterior. Incluso podría ser que la publicación de código se ejecuta después de la función se completa en el mismo hilo. No soy un experto en cómo el navegador funciona
    • No me gusta decir esto, pero creo que usted se equivoca. Dudo que usted sería capaz de producir una simple reproducción de la edición anterior (algunos jsfiddle), aislar el problema; .append es de hecho totalmente sincrónico. También tenga en cuenta que JavaScript es un único subproceso y no a las cosas (incluido el navegador) están mutando de datos al mismo tiempo.
    • ok, esto no tiene sentido para mí: he comprobado mi código, y estoy anexando un agility.js objeto para el árbol DOM. Agilidad desencadena un evento que, a continuación, llama jQuery apprend para agregar el punto de vista del objeto para el árbol DOM. Cuál es desconcertante mí es que, si javascript de un único subproceso, el evento de disparo debe resultar en el agility.js controlador de ser llamado inmediatamente, que no parece estar sucediendo. Es por eso que terminé usando el setTimeout. Por CIERTO, yo no veo ninguna setTimeout llamadas en agility.js
    • Ah, usted debe leer sobre el bucle de eventos 🙂
    • Ah! por lo que su caso y no en el hilo de eso es retrasar el render. Gracias por que Alan.
    • Ah, el bucle de eventos fue el aplazamiento de la ejecución del AJAX anexar…pavor, actualizado mi respuesta para ayudar a otras personas que podrían haber aterrizado en la misma confusión
    • Si append() es totalmente sincrónico, ¿cómo explicar el problema señalado en esta pregunta: stackoverflow.com/questions/6068955/…? Gracias!
    • La persona que publique esa pregunta también se malinterpreta la situación. Pero ellos no publicar ningún código o jsfiddle que muestra el error, así que quién sabe lo que quieren. Parece que no han oído hablar de «diseño de la trilla» o que comprendan la razón por la que sus supuestos son, de hecho, imposible

Dejar respuesta

Please enter your comment!
Please enter your name here