Lorsque l'on utilise l'Ajax pour mettre à jour le contenu d'une page, le code javascript contenu dans la réponse Ajax n'est pas exécuté par le navigateur.
Évaluer le javascript Ajax
Pour évaluer le code javascript d'un appel ajax j'utilise la fonction suivante :
xmlhttp.onreadystatechange = function (){
if (this.readyState == 4 && this.status == 200)
{
var e = document.getElementById('contener');
/*On ajoute le contenu de la réponse dans le Dom du document*/
e.innerHTML = xmlhttp.responseText;
/*On évalue le javascript contenu dans les dom*/
var scripts = e.getElementsByTagName('script');
for(var i=0; i < scripts.length;i++)
{
/*Sous IE il faut faire un execScript pour que les fonctions soient définie en globale*/
if (window.execScript)
{
/*On replace les éventuels com' html car IE n'aime pas ça*/
window.execScript(scripts[i].text.replace('<!--',''));
}
/*Sous les autres navigateurs on fait un window.eval*/
else
{
window.eval(scripts[i].text);
}
}
}
}
La variable xmlhttp est un objet XMLHttpRequest. L'élément 'contener' est l'objet dom dans lequel je veux ajouter la réponse de la requête Ajax.
On évalue de manière globale le javascript de chaque balise script afin que les fonctions soient définies au niveau du document.
Sous Internet Explorer, la fonction window.eval n'évalue pas le code javascript de manière globale, il faut utiliser la fonction window.execScript pour cela.