Метод jQuery ajax - getScript()

Пример

Получение и выполнение JavaScript файла через AJAX запрос:

$("button").click(function(){
  $.getScript("demo_ajax_script.js");
});

Попробуйте сами

Определение и использование

Метод getScript() загружает и выполняет файл JavaScript через HTTP GET запрос.

Грамматика

jQuery.getScript(url,success(response,status});
Параметры Описание
url Строка URL, которую нужно запросить.
success(response,status)

Опционально. Определяет обратную функцию вызова, которая будет выполнена после успешного выполнения запроса.

Дополнительные параметры:

  • response - включает данные результата запроса
  • status - включает состояние запроса ("успех", "неизменено", "ошибка", "время ожидания", "parsererror")

Подробное описание

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

$.ajax({
  url: url,
  dataType: "script",
  успех: успех
});

Функция вызова обратного вызова передаст возвращаемый файл JavaScript. Это обычно не очень полезно, потому что к тому времени скрипт уже выполнен.

Загружаемый скрипт выполняется в глобальном контексте, поэтому он может ссылаться на другие переменные и использовать функции jQuery.

Например, загрузка файла test.js, содержащего следующий код:

$('.result').html("<p>Lorem ipsum dolor sit amet.</p>");

С помощью ссылки на имя файла можно загрузить и запустить этот скрипт:

$.getScript("ajax/test.js", function() {
  alert("Загрузка выполнена.");
});

Комментарии:До версии jQuery 1.2, getScript мог вызывать только файлы JS из одного домена. В версии 1.2 вы можете вызывать файлы JavaScript из других доменов. Замечание: Safari 2 и более ранние версии не могут синхронно выполнять скрипты в глобальном контексте. Если вы добавляете скрипт с помощью getScript, добавьте функцию с задержкой.

Более сложные примеры

Пример 1

Загрузка и выполнение test.js:

$.getScript("test.js");

Пример 2

Загрузка и выполнение test.js, после успешного выполнения отображается информация:

$.getScript("test.js", function() {
  alert("Script загружен и выполнен.");
});

Пример 3

Загрузка Официальный плагин анимации цвета jQuery После успешного выполнения привязывается анимация изменения цвета:

HTML код:

<button id="go">Запуск</button>
<div class="block"></div>

jQuery код:

jQuery.getScript("http://dev.jquery.com/view/trunk/plugins/color/jquery.color.js",
 function() {
  $('#go').click(function() {
    $('.block').animate({backgroundColor: 'pink'}, 1000)
      .animate({backgroundColor: 'blue'}, 1000);
  });
});