Метод ajax()
Следующий метод, с которым я вас познакомлю будет $.ajax()
– собственно, он тут главный, и все остальные AJAX-методы являются лишь обёрткой (и load()
в том же числе). Метод $.ajax()
принимает в качестве параметра пачку настроек и URL.
Приведу пример, аналогичный вызову load()
:
$.ajax({
url: "/get-my-page.html", // указываем URL
method: "GET", // HTTP метод, по умолчанию GET
data: { "id": 42 }, // данные, которые отправляем на сервер
dataType: "html", // тип данных загружаемых с сервера
success: function (data) {
// вешаем свой обработчик события success
$("#content").html(data);
}
});
Тут мы обрабатывали HTML-ответ от сервера – это хорошо когда нам полстраницы обновить надо, но данные лучше передавать в «правильном» формате. XML – это понятно, структурировано, но избыточно и как-то не совсем JavaScript-way, и поэтому наш выбор – это JSON:
{
"note": {
"time": "2012.09.21 13:11:15",
"text": "Рассказать про JSONP"
}
}
Фактически, это и есть JavaScript-код как есть (JavaScript Object Notation, если быть придирчиво точным). При этом формат уже распространён настолько, что работа с данными в другом формате уже не приветствуется.
Жизнь не стоит на месте, есть и более удобные форматы, но не в JavaScript :) Мы же довольствуемся малым — текст, HTML, JSON или XML.
Для загрузки JSON существует быстрая функция-синоним — $.getJSON()
— в качестве обязательного параметра лишь ссылка, куда стучимся, опционально можно указать данные для передачи на сервер и функцию обратного вызова.
Ещё есть пара-тройка методов, которые стоит упомянуть:
get(url, data, success, dataType)
загружает данные методом GET
post(url, data, success, dataType)
загружает данные методом POST
getScript(url, success)
загружает JavaScript с сервера методом GET
Все они, как я уже говорил ранее, лишь обёртки над вызовом $.ajax()
, в чём несложно убедиться, заглянув в исходный код библиотеки. И там вы найдёте реализацию методов $.get()
и $.post()
:)
jQuery.each( [ "get", "post" ], function( i, method ) {
jQuery[ method ] = function( url, data, callback, type ) {
// Shift arguments if data argument was omitted
if ( isFunction( data ) ) {
type = type || callback;
callback = data;
data = undefined;
}
// The url can be an options object (which then must have .url)
return jQuery.ajax( jQuery.extend( {
url: url,
type: method,
dataType: type,
data: data,
success: callback
}, jQuery.isPlainObject( url ) && url ) );
};
} );
Метод getScript()
в свою очередь это лишь обёртка над $.get()
:
Last updated