Chiamata di Javascript in una pagina dopo che è stato caricato da jQuery GET
-
19-09-2019 - |
Domanda
Immaginate una normale javscript pagina chiamante in testa. Il problema è una delle isnt contenuto caricato fino clicco su un link. Successivamente quando questo link carica il contenuto non funzionerà. Questo perché credo che il javascript è già stato eseguito e per questo pretende molto attaccarsi a quegli elementi chiamati in seguito. C'è html unico standard essere chiamato.
Così, per esempio, questo è il codice che chiama il mio HTML esterno.
$.get('content.inc.php', {id:id}, function(data){
$('#feature').children().fadeTo('fast', 0).parent().slideUp('slow', function(){
$(this).html(data).slideDown('slow');
});
});
Se l'html stavo chiamando per esempio e tag H1 era già nella pagina Cufon avrebbe funzionato. Tuttavia perché sto caricare il contenuto tramite i suddetti tag H1 metodo non verrà modificato con i miei font.This scelto è solo un esempio. Lo stesso vale per qualsiasi javascript.
Sono stato wonering se c'è un modo per aggirare questo senza chiamare il javascript e html quando il suo ricevuto dalla funzione di cui sopra
Soluzione
Cufon.refresh()
fare quello che vuoi?
Come hai detto Cufon
era solo un esempio , Vorrei anche suggerire un più generale:
$.get(url, options, function(html, status) {
var dom = $(html);
// call your function to manipulate the new elements and attach
// event handlers etc:
enhance(dom);
// insert DOM into page and animate:
dom.hide();
$target_element.append(dom); // <-- append/prepend/replace whatever.
dom.show(); // <-- replace with custom animation
});
Altri suggerimenti
Se si desidera collegare gli eventi per gli elementi sulla pagina che vengono creati dinamicamente un'occhiata alla parola chiave "live".
$('H1').live("click", function() { alert('it works!'); });
Spero che questo è ciò che stavate cercando.
È possibile allegare i gestori di eventi per i dati che si ottiene tramite la get()
all'interno della funzione di callback. Ad esempio
$.get('content.inc.php', {id:id}, function(data){
$('#feature').children().fadeTo('fast', 0).parent().slideUp('slow', function(){
$(this).html(data).find('a').click(function(e) {
// specify an event handler for <a> elements in returned data
}).end().slideDown('slow');
});
});
live()
può anche essere un'opzione per voi, a seconda di quali eventi si desidera associare a (dal live()
utilizza delegazione evento, non tutti gli eventi sono supportati).
Andy provare questo. Si chiamerà il codice Cufon dopo ogni richiesta AJAX è completa e prima che il codice HTML è effettivamente aggiunto alla pagina.
$.get('content.inc.php', {id:id}, function(data){
$('#feature').children().fadeTo('fast', 0).parent().slideUp('slow', function(){
$(this).html(data);
Cufon.replace('h1');
$(this).slideDown('slow');
});
});
JavaScript non viene eseguito a causa di un motivo di sicurezza o beccause jQuery è appena impostazione innerHTML di questo elemento per un testo (che non è interpretato come un javscript) se essa è contenuta. Così la sicurezza è il lato effetto.
Come risolverlo?
cercare di trovare tutti i tag script nella vostra risposta ed eseguirli come Fallows:
var scripts = myelement.getElementsByTagName("SCRIPT");
var i = 0;
for (i = 0; i < scripts.length; i++)
eval(scripts[i].innerHTML);