ładowanie jQuery w innym pliku js

Question

Mam plik JavaScript, który również używa jQuery. Aby załadować go, napisałem ten kod:

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

include('http://ajax.googleapis.com/ajax/libs/jquery/1.7.0/jquery.min.js'); 
alert("1"); 

$(document).read(function(){}); 
alert("2"); 

Ten pożary alert("1"), ale drugi alert nie działa. Kiedy sprawdzam elementy, widzę błąd, który mówi, że $ nie jest zdefiniowany.

Jak powinienem rozwiązać ten problem?

Answer 1

trzeba wykonać dowolną jQuery specyficzny kod tylko raz skrypt zostanie załadowany, co oczywiście może się zdarzyć w znacznie późniejszym czasie po dołączenie jej do sekcji head:

function include(filename, onload) { 
    var head = document.getElementsByTagName('head')[0]; 
    var script = document.createElement('script'); 
    script.src = filename; 
    script.type = 'text/javascript'; 
    script.onload = script.onreadystatechange = function() { 
     if (script.readyState) { 
      if (script.readyState === 'complete' || script.readyState === 'loaded') { 
       script.onreadystatechange = null;             
       onload(); 
      } 
     } 
     else { 
      onload();   
     } 
    }; 
    head.appendChild(script); 
} 

include('http://ajax.googleapis.com/ajax/libs/jquery/1.7.0/jquery.min.js', function() { 
    $(document).ready(function() { 
     alert('the DOM is ready'); 
    }); 
}); 

A tutaj jest live demo.

Możesz także rzucić okiem na ładowarki skryptów, takie jak yepnope lub RequireJS, które ułatwiają to zadanie.

Answer 2

Problem prawdopodobnie polega na tym, że mimo włączenia skryptu, nie oznacza to, że jest on ładowany podczas próby wykonania $(document).ready(function(){});. Można zajrzeć do Google Loader Aby uniknąć tego problemu http://code.google.com/intl/fr-FR/apis/loader/