C’è qualcosa di simile a `$ (window) .load ();` per eseguire una funzione dopo che il contenuto Ajax appena inserito ha finito il caricamento?

Dopo aver fatto una richiesta $(element).load(url, callback); facendo qualcosa di semplice come $(element).load(url, callback); ci saranno nuovi contenuti nella pagina che include immagini e così via.

C’è un modo per fare qualcosa di simile a $(window).load(callback) dopo che il nuovo contenuto ha terminato il caricamento?

$(window).load(); funziona bene quando la pagina è nuova, in modo da poter mostrare un’animazione di caricamento fino a quando non viene caricato tutto il contenuto, ma qualcosa di semplice come questo sembra mancare quando il contenuto viene caricato dopo che $(window).load() è già stato triggersto.

EDIT 6/6/12 23:55: Penso che tutti stiano fraintendendo la mia domanda. Lasciami spiegare un po ‘meglio:

Quando si carica per la prima volta una pagina, è ansible sfruttare questi due eventi con jQuery: $(document).ready(); e $(window).load(); . Il primo si triggers quando il DOM è pronto e il secondo si triggers quando viene caricato il contenuto (immagini, ecc.). Dopo aver aggiornato la pagina utilizzando il metodo .load() di jQuery, sono pienamente consapevole che posso passare un callback da eseguire dopo che Ajax è stato completato.

    Non è quello che voglio. Voglio eseguire una funzione dopo che il nuovo contenuto ha terminato il caricamento , simile a quando $(window).load(); si accende dopo il caricamento del contenuto iniziale di una pagina.

    Ha senso? Come possiamo creare un evento simile a $(window).load(); per fare cose dopo che il contenuto di Ajax è stato caricato ( non solo dopo che l’HTML è stato inserito)?

    Secondo jQuery:

    L’evento load viene inviato a un elemento quando questo e tutti gli elementi secondari sono stati caricati completamente. Questo evento può essere inviato a qualsiasi elemento associato a un URL: immagini, script, frame, iframe e l’object finestra.

    Quindi, dopo che il DOM è stato aggiornato (ad esempio con contenuto Ajax), sto impostando un listener per gli eventi “load” su tutte le immagini appena inserite:

     function when_images_loaded($img_container, callback) { // do callback when images in $img_container (jQuery object) are loaded. Only works when ALL images in $img_container are newly inserted images and this function is called immediately after images are inserted into the target. var _imgs = $img_container.find('img'), img_length = _imgs.length, img_load_cntr = 0; if (img_length) { //if the $img_container contains new images. _imgs.on('load', function() { //then we avoid the callback until images are loaded img_load_cntr++; if (img_load_cntr == img_length) { callback(); } }); } else { //otherwise just do the main callback action if there's no images in $img_container. callback(); } } 

    Questo è utile per consentire al contenuto di rimanere nascosto fino a quando le immagini non sono pronte. Se hai immagini di sfondo che verranno visualizzate come immagini di sfondo, questo non funzionerà. Una soluzione alternativa sarebbe quella di caricare tutte le immagini che stai utilizzando nei tuoi stili CSS in un contenitore che rimarrà nascosto in modo che la funzione sopra riportata ti consenta di caricare le immagini. Una volta caricate tutte le immagini, puoi rimuovere l’elemento che contiene le tue sole immagini CSS e in questo modo il browser renderà gli sfondi (ecc.) Istantaneamente quando visualizzi il contenuto.

     $(element).load(url, function(){ //this code is executed after the page is loaded }) 

    È ciò che intendi?

    sembra che tu stia cercando un approccio globale per gestire tutti gli eventi completi di ajax. puoi farlo in questo modo.

     $(document).ready(function () { $(document).ajaxComplete(function () { alert('ajax completed.') }); $('#d').load("url-to-page", function (response, status, xhr) { if (status == "error") { var msg = "Sorry but there was an error: "; alert(msg + xhr.status + " " + xhr.statusText); } }); }); 

    Mi sono imbattuto in questo problema pochi giorni fa e ho usato la tua risposta alla tua domanda in quel momento, ma da allora sono incappato nelle immagini plug-in Lava che potrebbero essere utili per chiunque altro in futuro.

    Penso che tu non l’abbia fatto. Devi semplicemente triggersre l’evento ajax di successo che verrà eseguito dopo che ajax è stato completato. È abbastanza per te. Non hai bisogno di eventi come .load () per elementi specifici restituiti da Ajax. Ma puoi provare ad associare l’evento load () ad un elemento come dopo che html viene restituito dal server ma prima che sia inserito nel DOM