jQuery.getJSON( url, [ данные ], [ success(данные, текстСтатус, jqXHR) ] )
Возвращает: jqXHR
Описание: Загружает данные JSON используя метод GET.
Аргументы
jQuery.getJSON( url, [ данные ], [ success(данные, текстСтатус, jqXHR) ] )
url
Строка, содержащая URL, к которому направлен запрос.
Карта (ключ/значение) или строка, которые отправляется на сервер с запросом.
success(данные, текстСтатус, jqXHR)
Функция, которая исполняется всякий раз после удачного завершения загрузки данных.
Это сокращенная функция Ajax, которая эквивалентна:
$.ajax({ url: url, dataType: 'json', data: data, success: success });
Данные, которые отправляются на сервер добавляются к URL, как к строке запроса. Если данные параметра
data являются объектом (картой), они преобразуются в строку и закодированный URL перед тем как добавляются к URL.Большинство реализаций определит обработчик успешного выполнения:
Этот пример, конечно, зависит от структуры файла JSON:
{
"one": "Singular sensation",
"two": "Beady little eyes",
"three": "Little birds pitch by my doorstep"
}
Используя эту структуру, пример перебирает полученные данные, строит ненумерованный список, и добавляет его к телу документа.
Функция обратного вызова success передает возвращенные данные, которые, как правило, объект JavaScript или массив, как определено структурой JSON, и анализирует с помощью метода $.parseJSON(). Она также передает статус текста ответа.
Начиная с jQuery 1.5, функция обратного вызова success получает объект "jqXHR" (в jQuery 1.4, она получала объект XMLHttpRequest). Однако, поскольку JSONP и кросс-доменные запросы GET не используют XHR, в этих случаях параметры jqXHR и textStatus передаваемые в функцию обратного вызова не будут определены.
Важно: Начиная с jQuery 1.4, если файл JSON содержит синтаксическую ошибку, запрос обычно молча падает. По этой причине избегайте частого ручного редактирования данных JSON. JSON является данными формата обмена с правилами синтаксиса, которые являются более жесткими, чем буквальное обозначение объекта языка JavaScript. Для примера, все строки представленные в JSON, являются ли они свойствами или значениями, должны быть заключены в двойные кавычки. Для деталей по формату JSON, смотрите http://json.org/.
JSONP
Если URL включает строку "callback=?" (или аналогичные, как это определено на стороне сервера API), запрос рассматривается вместо этого как JSONP. Для большей информации смотрите обсуждение по типам данных jsonp в $.ajax().
Объект jqXHR
Начиная с jQuery 1.5, все методы jQuery Ajax возвращают расширенный объект XMLHTTPRequest. Это объект jQuery XHR, или "jqXHR", возвращаемый с помощью $.get() реализует интерфейс Promise, придав ему все свойства, методы и поведение Promise (смотрите Отсроченный объект для полной информации). Для удобства и совместимости с функцией обратного вызова имен, используемых в $.ajax(), он обеспечивает методы .error(), .success() и .complete(). Эти методы принимают аргумент функции, которая вызывается когда запрос завершается, и функция получает те же аргументы, соответственно названиям функции обратного вызова $.ajax().
Интерфейс Promise в jQuery 1.5 также позволяет методам jQuery Ajax, включая $.getJSON(), соединять многочисленные функции обратного вызова .success(), .complete() и .error() на единичный запрос, и даже назначает эти функции обратного вызова после того как запрос может быть завершен. Если запрос уже завершен, функция обратного вызова немедлено вызывается.
// Assign handlers immediately after making the request,
// and remember the jqxhr object for this request
var jqxhr = $.getJSON("example.json", function() {
alert("success");
})
.success(function() { alert("second success"); })
.error(function() { alert("error"); })
.complete(function() { alert("complete"); });
// perform other work here ...
// Set another completion function for the request above
jqxhr.complete(function(){ alert("second complete"); });
Примеры
Пример 1
Загружает 4 последние изображения из Flickr JSONP API.Пример 1 - Полный код:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<style>img{ height: 100px; float: left; }</style>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript" language="javascript">
$(document).ready(function(){
$.getJSON("http://api.flickr.com/services/feeds/photos_public.gne?tags=cat&tagmode=any&format=json&jsoncallback=?",
function(data){
$.each(data.items, function(i,item){
$("<img/>").attr("src", item.media.m).appendTo("#images");
if ( i == 3 ) return false;
});
});
});
</script>
</head>
<body>
<div id="images">
</div>
</body>
</html>
Пример 2
Загружает данные JSON из test.js и выводит в сообщении имя из полученных данных JSON.
$.getJSON("test.js", function(json){
alert("JSON Data: " + json.users[3].name);
});
Пример 3
Загружает данные JSON из test.js, передает дополнительные данные, и выводит в сообщении имя из полученных данных JSON.
$.getJSON("test.js", { name: "John", time: "2pm" }, function(json){
alert("JSON Data: " + json.users[3].name);
});
Пример 4
Выводит результаты обработки страницы pages.php в виде массива. Автор Manuel Gonzalez.
var id=$("#id").attr("value");
$.getJSON("pages.php",{id:id},dates);
function dates(datos) {
$("#list").html("Name:"+datos[1].name+"<br>"+"Last Name:"+datos[1].lastname+"<br>"+"Address:"+datos[1].address);
}
Была ли эта информация полезной?
