Lo script caricato tramite .load () fallisce

.load() caricando una pagina di contatto usando .load() che contiene uno script che assomiglia a questo:

  $('#submit').click(function(e){ e.preventDefault(); var name = $('#name').val(); var email = $('#email').val(); var message = $('#message').val(); $.post("", { name: name, email: email, message: message }, function(data) { var n = data.indexOf(''); if (n !== 0) { $('#message_box_1').empty().append(data); } else { $('#contact_form').empty().append(data); } } ); });  

Lo script funziona bene quando carico la pagina di contatto direttamente (es. Vai a http://example.com/contact-us ) ma non lo fa quando carico il modulo e lo script nella dom usando .load() . Quando faccio clic su #submit , il modulo viene #submit senza eseguire lo script. Qualche idea su cosa sta succedendo?

Oh e lo script di caricamento ha questo aspetto:

  $('#top_links a').click(function (e) { e.preventDefault(); var link = $(this).attr('href'); $('#content').empty(); $('#content').load(link + ' #content > *'); });  

AGGIORNARE:

Grazie a @pointy per aver segnalato i problemi con .load() . Così ora ho modificato il mio codice per usare $.get :

  $('#top_links a').click(function (e) { e.preventDefault(); var link = $(this).attr('href'); $('#content').empty(); $.get(link, { }, function(data) { $('#content').replaceWith($(data).find("#content")); } ) });  

Il problema è lo stesso, lo script AJAX precedente non impedisce al modulo di inviare o inviare una richiesta di post quando l’utente fa clic sul pulsante di invio. Ho inserito entrambi gli script al di fuori del contenuto che viene caricato con $.get

Quando carichi con .load() e usi un selettore dopo l’URL che stai facendo, jQuery semplicemente non esegue nessuno script nel contenuto caricato. Li espelle esplicitamente e li butta via.

Penso che la ragione principale per cui questo è che, poiché sta buttando via parte della pagina che è stata caricata, non ha idea se gli script incorporati all’interno del contenuto selezionato funzioneranno senza altri JavaScript nella pagina che non è selezionata.

modifica – sfortunatamente il tuo codice sostitutivo subirà lo stesso problema. Il problema è che $(data) implica la conversione del codice HTML della pagina restituita in un frammento di documento. Questo, interno a jQuery, passerà attraverso una funzione chiamata “clean” che rimuove gli script. Li salva, ma vengono buttati via quando viene restituita la chiamata alla funzione $(data) .

Probabilmente sarà molto più agevole se riuscirai a capire come il tuo server possa fare il lavoro per capire che non deve restituire una pagina completa. Renderà le cose più veloci comunque; non ha senso spedire una pagina completa quando ne userai solo una parte.

Il problema era che il pulsante di invio era caricato in modo dinamico e avevo bisogno di usare live (). $("#submit").live("click", function(e){})