Manipulación de elementos después de Ajax Load ()

Question

Estoy tratando de manipular algunos elementos después de cargarlos usando .Load (). Tengo todo cargando correctamente, pero parece que no puedo apuntar a ningún elemento dentro de ninguno de los elementos cargados. Esto parece algo que sería fácil, pero puedo decirlo.

Estoy usando una devolución de llamada después de la carga de los elementos, pero ¿el DOM parece no estar al tanto de su existencia?

function load_page(){
    $('#page_name').load("/page-name/ .page", null, load_complete());
}

function load_complete() {
    $('#page_name .book_img').addClass('hello');
}

Ok, aquí es donde estoy ahora. Yo he añadido...

$('#wrapper').ajaxComplete(function() {
    $('#page_name .book_img').addClass('hello');
}

que funciona. Debe haber una diferencia entre el .autocomplete y la devolución de llamada que se empaqueta con la función .load (). Realmente no me gusta esto porque se llama cada vez que un evento Ajax termina de cargarse, pero me lleva un poco más adelante.

¿Alguien tiene algo mejor?

EDITAR

También lo intenté ...

$('#wrapper').ajaxComplete(function() {
    $('#page_name .book_img').addClass('hello');
}

Lo cual es un poco bueno ya que espera hasta que todas las llamadas de Ajax se realicen antes de llamar a la función. ¿Quizás esta es la forma de hacerlo, pero todavía parece que la función .Load () se encargaría de esto?

Answer 1

Parece que está ejecutando su función de devolución de llamada en lugar de pasarla al método de carga:

function load_page(){
    // $('#page_name').load("/page-name/ .page", null, load_complete());
    $('#page_name').load("/page-name/ .page", null, load_complete);
}

function load_complete() {
    $('#page_name .book_img').addClass('hello');
}

Entonces, lo que se estaba pasando al método de carga es nulo porque no hay valor de retorno en load_complete

Answer 2

A veces, el HTML tarda un poco en renderizar. Intente agregar un retraso antes de acceder al nuevo contenido:

$('#page_name').load("/page-name/ .page", null, window.setTimeout(function(){load_complete()},50);

Answer 3

Debe incluir el JavaScript que es manipular sus objetos cargados en el elemento que se está cargando. Esto se debe a que ya ha pasado por todo su JavaScript.

editar

Pruebe esto, establezca la AsynChronicity en False para que pueda agregar una devolución de llamada después de cargar.

$.ajax ({
  async: false,
  type: "GET",
  dataType: "html",
  url: "/page-name/ .page",
  complete: function(){load_complete()};
});

actualizar

Oye, también hay esta declaración de taquigrafía que uso ocasionalmente. Me sorprende que estos no funcionen en su guión.

$.get($(this).attr('href'), function(response) { $('#content').html(response); });