Версия для печати. Взято с сайта phpsql.ru

На главную   Назад   Вперед

Функция $.getJSON()

Функция $. get JSON () позволяет получить данные в форматах JSON и JSONP мето-дом GET. Формат функции:

$.getJSON{URL[, Данные] [, Функция обратного вызова])

Следует учитывать, что при использовании формата JSON данные можно загрузить толь-ко с того же домена. Необязательный параметр Данные позволяет передать несколько па-раметров. Для этого параметры и значения должны быть указаны следующим образом.
{
Параметр1: “ Значение1",
Параметр2: "Значение2",
Параметры: "ЗначениеЫ"
}

В качестве параметра Функция обратного вызова указывается ссылка на функ-цию следующего формата.

function Название функции DOM-объект [, Статус]) { // ...
}

Внутри функции обратного вызова доступна ссылка (this) на объект с параметрами запроса. После получения данных они автоматически выполняются с помощью функции eval (), и JSON-объект становится доступным через первый параметр. С помощью параметра Статус можно получить статус запроса (значение succcss — при успешном выполнении).

В качестве примера рассмотрим получение данных в формате. JSON. Создадим файл index.php (листинг 11.4), который будет обмениваться данными с файлом ajax.php (листинг 11.5), расположенным на том же домене.

Листинг 11.4. Содержимое файла index.php

<html>
<head>
<title>Функция $.getJSON() и JSON</title>
<meta http-equiv="Content-Type" content="text/html;
charset=utf-8">
<script src="jquery.js" type="text/javascript"></script>
<script type="text/javascript">
<!--
$(document).ready(function() {
   $(":button").click(function() {
      $.getJSON("/ajax.php", { txt: "test" },
         function(jsonObject) {
            $("#div1").html("param1 = " + jsonObject.param1 +
               "<br>" + "param2 = " + jsonObject.param2);
         }
      );
   });
});
//-->
</script>
</head>
<body>
<div id="div1"></div>
<input type="button" value="Получить данные">
</body>
</html>

Листинг 11.5. Содержимое файла ajax.php

<?php
header(`Expires: Sun, 27 May 2007 01:00:00 GMT`);
header(`Last-Modified: ` . gmdate(`D, d M Y H:i:s`) . ` GMT`);
header(`Cache-Control: no-store, no-cache, must-revalidate`);
header(`Pragma: no-cache`);
header(`Content-Type: text/javascript; charset=utf-8`);
if (!isset($_SERVER[`HTTP_X_REQUESTED_WITH`])) {
   exit(`Данные отправлены не через AJAX`);
}
if (!isset($_GET[`txt`])) {
   exit(`Некорректные параметры запроса`);
}
?>
{
param1: "Значение 1",
param2: "<?php echo $_GET[`txt`]; ?>"
}

Функция $ . getJSON () позволяет также получать данные в формате JSONP с друго-го домена методом GET. Чтобы отправить данные этим методом, необходимо после па-раметров в URL-адресе указать конструкцию: Параметр=?

Название параметра может быть произвольным,

http://sitel/ajax.php?txt=test&callback=?

Если в конце запроса указан вопросительный знак, то данные будут отправлены не с помощью технологии AJAX, а путем создания тега script с указанием URL-адреса в параметре src. Вместо вопросительного знака будет вставлено произвольное значение. Запрос на сервер будет выглядеть примерно следующим образом.

GET /ajax.php?txt=test&callback=jsonpl24 751862 2 796&_=124 751862415 6
HTTP/1.1 Host: sitel

Как видно из примера, вместо знака вопроса мы получили следующую строку.
jsonpl24 7518622 796&_=124 7 518624156

Значение параметра callback необходимо указать перед данными в формате JSON в скрипте на сервере. Сами данные указываются внутри круглых скобок.
jsonpl247518622796({
paraml: "Значение 1",
param2: "Значение 2"
});

В качестве примера рассмотрим получение данных в формате JSONP с другого доме-на. Создадим файл index.php (листинг 11.6) и разместим его на домене http:// localhost/. С помощью этого файла будем обмениваться данными со скриптом ajax.php (листинг 11.7), расположенным на домене http: / /sitel/.

Листинг 11.6. Содержимое файла http://localhost/index.php

<html>
<head>
<title>Функция $.getJSON() и JSONP</title>
<meta http-equiv="Content-Type" content="text/html;
charset=utf-8">
<script src="jquery.js" type="text/javascript"></script>
<script type="text/javascript">
<!--
$(document).ready(function() {
   $(":button").click(function() {
      $.getJSON("http://site1/ajax.php?txt=test&callback=?",
         function(jsonObject) {
            $("#div1").html("param1 = " + jsonObject.param1 +
               "<br>" + "param2 = " + jsonObject.param2);
         }
      );
   });
});
//-->
</script>
</head>
<body>
<div id="div1"></div>
<input type="button" value="Получить данные">
</body>
</html>

Листинг 11.7. Содержимое файла http://sit.e1/ajax.php

<?php
header(`Content-Type: text/javascript; charset=utf-8`);
if (!isset($_GET[`callback`])) {
   exit(`Некорректные параметры запроса`);
}
echo $_GET[`callback`]; ?>({
param1: "Данные с другого домена",
param2: "<?php echo $_GET[`txt`]; ?>"
});

 
Предыдущая   На главную   Следующая