jQuery: Nach Ajax-Response script-Tags in bestimmten DIVs ausführen

Dienstag, 18. Oktober 2011

Beim Laden über die schöne jQuery.ajax()-Funktion wollten wir nicht nur die Inhalte eines bestimmten DIVs austauschen, sondern auch alle JavaScripte im neuen DIV ausühren. Leider werden alle Script-Tags automatisch “bereinigt” bevor man sie in das DOM einfügen kann. Nach einigen Versuchen kamen wir dann auf folgende Lösung.

$.ajax({
   url: "http://....",
   success: function ( data ) {
 
      // Dieses DIV soll ersetzt werden - und alle script-Tags innerhalb des DIVs ausgeführt werden
      var target=".testdiv";	
 
      // Erst mal den Inhalt des DIVs mit dem neuen Inhalt ersetzen
      $(target).html( $(target, data).contents() );
 
      // Jetzt über ein paar Umwege die gewünschten Script-Tags innerhalb des DIVs finden und ausführen
      var div = document.createElement('div');
      div.innerHTML = data;
      var ref = $($(div).find(target).html());
      ref.filter('script').each(function () {
         $.globalEval(this.text || this.textContent || this.innerHTML || '');
      });
   }
});

Für Suchmaschinen: “jQuery Ajax Script-Tag” “execute script tags jquery ajax response” “script tags ajax response” “script in div ajax response” “einzelne script-Tags ausführen jquery ajax” “jquery script clean” “ajax javascript script ausführen”

| Keine Kommentare »