2015-05-20 5 views
4

Я загрузке мой скрипт файлы динамически с помощью этого кода,Jquery скрипт не загружен, на AppendChild

<script type="text/javascript"> 
    var newscript = document.createElement('script'); 
    newscript.type = 'text/javascript'; 
    newscript.src = '../static/js/jquery.js'; 
    document.getElementsByClassName('container')[0].appendChild(newscript); 

    var newscript = document.createElement('script'); 
    newscript.type = 'text/javascript'; 
    newscript.src = '../static/js/report_app.js'; 
    document.getElementsByClassName('container')[0].appendChild(newscript); 

</script> 

Он бросает ошибку, как,

Reference error: $ is not defined 

в report_app.js.

Я думал, что сценарий должен быть загружен в DOM при анализе следующего файла, report_app.js.

Но ошибка показывает, jquery.js не выполняется. Как обеспечить загрузку одного файла сценария перед запуском следующего?

+0

Где и когда вы используете $? –

+1

Таким образом, скрипты загружаются асинхронно, используя событие загрузки jQuery script, чтобы добавить второе. И избегайте использовать одно и то же имя переменной дважды –

+0

@OlegYudovich, $ используется внутри report_app.js –

ответ

5

Это происходит потому, что скрипт добавлен асинхронно, вы можете использовать функцию обратного вызова OnLoad

function addScript(path, callback) { 
    var newscript = document.createElement('script'); 
    newscript.type = 'text/javascript'; 
    newscript.src = path; 
    newscript.onload = callback; 
    document.body.appendChild(newscript); 

} 

addScript('http://code.jquery.com/jquery-1.11.2.js', function() { 
    addScript('../static/js/report_app.js'); 
}) 

Демо: Fiddle

Смежные вопросы