jQuery — метод загрузки AJAX ()


JQuery метод загрузки ()

Метод jQuery load()— это простой, но мощный метод AJAX.

Метод load()загружает данные с сервера и помещает возвращенные данные в выбранный элемент.

Синтаксис:

$(selector).load(URL,data,callback);

Обязательный параметр URL указывает URL-адрес, который вы хотите загрузить.

Необязательный параметр данных указывает набор пар ключ/значение строки запроса для отправки вместе с запросом.

Необязательный параметр обратного вызова — это имя функции, которая будет выполняться после завершения load()метода.

Вот содержимое файла нашего примера: «demo_test.txt»:

<h2>jQuery and AJAX is FUN!!!</h2>
<p id="p1">This is some text in a paragraph.</p>

В следующем примере содержимое файла «demo_test.txt» загружается в определенный <div>элемент:

Пример

$("#div1").load("demo_test.txt");

Также можно добавить селектор jQuery к параметру URL.

В следующем примере содержимое элемента с id="p1" загружается из файла "demo_test.txt" в определенный <div>элемент:

Пример

$("#div1").load("demo_test.txt #p1");

Необязательный параметр обратного вызова указывает функцию обратного вызова, которая будет запущена после завершения load()метода. Функция обратного вызова может иметь разные параметры:

  • responseTxt - содержит результирующий контент, если вызов прошел успешно
  • statusTxt - содержит статус вызова
  • xhr - содержит объект XMLHttpRequest

В следующем примере отображается окно предупреждения после завершения метода load(). Если load()метод выполнен успешно, отображается сообщение «Внешний контент успешно загружен!», а в случае сбоя отображается сообщение об ошибке:

Пример

$("button").click(function(){
  $("#div1").load("demo_test.txt", function(responseTxt, statusTxt, xhr){
    if(statusTxt == "success")
      alert("External content loaded successfully!");
    if(statusTxt == "error")
      alert("Error: " + xhr.status + ": " + xhr.statusText);
  });
});

Справочник по JQuery AJAX

Полный обзор всех методов jQuery AJAX см. в нашем справочнике jQuery AJAX .