Mit AJAX nachgeladene Javascript-Funktionen ausführbar machen

Problem:

ersetzt man einen Teil einer Seite dynamisch per Ajax und enthält dieser Inhalt Javascript-Funktionen, so können diese leider nicht ausgeführt werden.

Dafür gibts aber eine Lösung:

Folgende Funktion muss in den Teil der Seite eingebaut werden, der nicht ersetzt wird:


function evalScript(scripts)
{ try
{ if(scripts != '')
{ var script = "";
scripts = scripts.replace(/]*>([\s\S]*?)<\/script>/gi, function(){
if (scripts !== null) script += arguments[1] + '\n';
return '';});
if(script) (window.execScript) ? window.execScript(script) : window.setTimeout(script, 0);
}
return false;
}
catch(e)
{ alert(e)
}
}


den, per AJAX nachgeladenen Text bzw. HTML - / JavaScript - Code, jagd man einmal durch diese Funktion und ersetzt dann das entsprechende Seitenelement wie normal.

function ersetze_seitenelement() {
if (http_request.readyState == 4) {
if (http_request.status == 200) {
text = http_request.responseText;
evalScript(text);
document.getElementById('seitenelement2').innerHTML=text;
}
}
}

Im nachgeladenen Inhalt jedoch, müssen die Javascript-Funktionen anders deklariert werde, damit das auch alles klappt.
statt

<script type="text/javascript">
function blabla() {
befehl;
}
</script>

muss es so aussehen:

<script type="text/javascript" defer="defer">
self.blabla = function () {
befehl;
};
</script>

es muss also das defer="defer" hinzugefügt werden.
Außerdem muss hinter jede Funktion ein ";" stehen.