Lade jQuery in ein js und führe dann ein Skript aus, das davon abhängt

Question

Jun 28, 2010, 02:24 AM

Lade jQuery in ein js und führe dann ein Skript aus, das davon abhängt

Ich habe ein einzigartiges Problem -

Ich entwerfe eine Webanwendung, die Widgets erstellt, die ein Benutzer dann in seine eigene Seite einbetten kann (hauptsächlich Blog-Posts). Ich möchte, dass sie nur eine Zeile einbetten müssen, also musste diese Zeile eine include-Anweisung sein, um ein Javascript von meinem Server zu entfernen.

Das Problem ist, dass ich den Widget-Code mit jQuery erstelle und das jQuery-Plugin laden muss, da ich offensichtlich nicht weiß, ob meine Benutzer es zur Verfügung haben oder nicht. Ich dachte 'das sollte ziemlich einfach sein' ....

function includeJavaScript(jsFile) {
  var script = document.createElement('script');
  script.src = jsFile;
  script.type = 'text/javascript';
  document.getElementsByTagName('head')[0].appendChild(script);
}

includeJavaScript('http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js');
jQuery();

Also, ich hänge die jQuery-Datei an den Kopf an und versuche anschließend, eine jQuery-Funktion auszuführen. Das Problem ist, das funktioniert nicht! Jedes Mal, wenn ich es ausführe, erhalte ich die Fehlermeldung, dass die Variable jQuery nicht definiert ist. Ich habe ein paar Dinge ausprobiert. Ich habe versucht, die jQuery-Funktionen in einen onLoad-Trigger zu setzen, damit die gesamte Seite (einschließlich vermutlich der jQuery-Datei) geladen wird, bevor sie mein Skript aufruft. Ich habe versucht, die jQuery-Funktion in eine separate Datei zu schreiben und sie nach dem Laden der jQuery lib-Datei zu laden. Aber ich habe die Idee, dass ich etwas Einfaches vermisse - ich bin neu in jQuery, also wenn ich etwas Offensichtliches vermisse, entschuldige ich mich ...

BEARBEITE

OK, ich habe den Vorschlag von digitalFresh wie folgt ausprobiert (mit Safari 5, wenn das hilft), erhalte aber trotzdem den gleichen Fehler?

function test() {
    jQuery()
}

var script = document.createElement("script");
script.type = "text/javascript";
script.src = 'http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js';
script.onload = test(); //execute
document.body.appendChild(script);

BEARBEITE

OK, ich habe es endlich zum Laufen gebracht, in einem spontanen Vorschlag von Brendan, indem ich den Aufruf ITSELF in einen 'Onload'-Handler gesteckt habe, wie folgt:

function addLoadEvent(func) { 
      var oldonload = window.onload; 
      if (typeof window.onload != 'function') { 
        window.onload = func; 
      } else { 
        window.onload = function() { 
          if (oldonload) { 
            oldonload(); 
          } 
          func(); 
        } 
    } 
} 
addLoadEvent( function() {
    var script = document.createElement("script");
    script.type = "text/javascript";
    script.src = 'http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js';
    document.body.appendChild(script);
    jQuery();
});

ie Sie sehen, muss ich es zu diesem Zeitpunkt noch nicht einmal in einen 'Onload' versetzen - es funktioniert einfach. Obwohl ich zugeben muss, verstehe ich immer noch nicht, WARUM es funktioniert, was mich stört ...

Zu kommentieren