jQuery getScript не работает, или я использую его неправильно - PullRequest
Новая
       33

jQuery getScript не работает, или я использую его неправильно

0 голосов
/ 15 января 2019

У меня проблемы с получением $ .getScript jquery для работы. Вот тестовый файл, demo.html: 

<!DOCTYPE html>

<script src="/xyz/scripts/jquery-1.11.0.min.js"></script>
<script>
    function wow() { return 3; }
</script>

<h1>Demo</h1>

<script>
    console.log(wow);
    console.log(wow());
</script>

При просмотре этого в Chrome в Windows 10 на консоли отображается следующее: 

Navigated to https://example.org/xyz/tools/demo.html
demo.html:11 ƒ wow() { return 3; }
demo.html:12 3

что правильно.

Затем я перемещаю определение функции в файл myModule.js: 

function wow() { return 3; }

и создайте demo2.html, который является demo.html с определением функции, замененным вызовом getScript: 

<!DOCTYPE html>

<script src="/xyz/scripts/jquery-1.11.0.min.js"></script>
<script>
    $.getScript("myModule.js");
</script>

<h1>Demo</h1>

<script>
    console.log(wow);
    console.log(wow());
</script>

На этот раз я получаю 

Navigated to https://example.org/xyz/tools/demo2.html
demo2.html:11 Uncaught ReferenceError: wow is not defined
at demo2.html:11

Я неправильно понимаю, для чего предназначен $ .getScript или как он используется?

Добавление

В ответ на предложение обернуть мои вызовы console.log в оболочку $ .ready, я попытался сделать следующее: 

<!DOCTYPE html>

<script src="/xyz/scripts/jquery-1.11.0.min.js"></script>
<script>
    $.getScript("myModule.js");
</script>

<h1>Demo</h1>

<script>
$.ready(function() {
    console.log(wow);
    console.log(wow());
});
</script>

На этот раз я не получил сообщение об ошибке , но также значения wow и wow () не были записаны в консоль.

Ответы [ 4 ]

0 голосов
/ 16 января 2019

Благодаря @ freedomn-m, который упомянул Promises в комментарии к ответу, я натолкнулся на предыдущую публикацию, в которой обсуждается $ .when (). Done () на Как включить несколько файлов js с помощью jQuery $ Метод .getScript () . Это привело к скрипту, который работал: 

<!DOCTYPE html>

<script src="/xyz/scripts/jquery-1.11.0.min.js"></script>
<script>
    $.when(
        $.getScript("myModule.js")
    ).done(function() {
        console.log(wow);
        console.log(wow());
    });
</script>

<h1>Demo</h1>
0 голосов
/ 15 января 2019

Вызов getScript() является асинхронной операцией, она не блокирует выполнение остальной части JavaScript.У вас есть два варианта:

1) Обернуть скрипт, требующий содержания getScript() в $(document).ready() для задержки выполнения до тех пор, пока все не загрузится.

2) Передать обратный вызов как второйаргумент getScript.Этот обратный вызов будет выполнен, если getScript() завершится успешно.

0 голосов
/ 15 января 2019

getScript - это асинхронный метод , поэтому вам необходимо получить доступ к его переменным в обратном вызове следующим образом: 

$.getScript( "ajax/test.js", function( data, textStatus, jqxhr ) {
  console.log( data ); // Data returned
  console.log( textStatus ); // Success
  console.log( jqxhr.status ); // 200
  console.log( "Load was performed." );
});

Ваш console.log (вау); был выполнен до полной загрузки скрипта.

0 голосов
/ 15 января 2019

$. Getcript

https://api.jquery.com/jquery.getscript/

Это сокращенная Ajax-функция, которая эквивалентна: 

$.ajax({
  url: url,
  dataType: "script",
  success: success
});

so $.getscript выполняет асинхронный вызов, поэтому ваш код эквивалентен:

  • $. Getscript - начать загрузку сценария
  • console.log (wow) - не может его найтипока скрипт еще не загружен
  • ... завершить загрузку скрипта

Вы можете использовать обратный вызов для выполнения кода, когда скрипт загружен: 

$.getScript("myModule.js", function() {
    console.log(wow);
    console.log(wow());
});
...