Страница 1 из 1

Отправка GET и POST запросов с помощью jQuery

Добавлено: 17 июн 2011, 11:06
Александр
Отправка GET и POST запросов с помощью jQuery

В этом уроке показано как отправлять get и post запросы с помощью javascript (jquery) и как получать и обрабатывать ответ в формате json.

Код: Выделить всё

<html><head><title>jquery get post</title><script src="js/jquery-1.6.1.min.js" type="text/javascript"></script><script type="text/javascript">$(function(){ // отправка get запроса без параметров$('#get_btn').click(function() {    $.get('http://flapps.ru/apps/test/addlink.php',        function(data){            if (data.success) {                $('#result').html(data.success.msg);            } else {                $('#result').html(data.error.msg);            }        }, "json");    return false;}); // отправка get запроса с передачей параметров$('#get2_btn').click(function() {    $.get('http://flapps.ru/apps/test/addlink.php?link=http://flapps.ru&title=Форум',        function(data){            if (data.success) {                $('#result').html(data.success.msg);            } else {                $('#result').html(data.error.msg);            }        }, "json");    return false;});  // отправка post запроса с передачей параметров$('#post_btn').click(function() {    $.post('http://flapps.ru/apps/test/addlink.php', {"url": 'http://flapps.ru', "title": 'Форум'},        function(data){            if (data.success) {                $('#result').html(data.success.msg);            } else {                $('#result').html(data.error.msg);            }        }, "json");    return false;});  });</script></head><body><a href="#" id="get_btn">get без параметров</a><br /><a href="#" id="get2_btn">get с параметрами</a><br /><a href="#" id="post_btn">post с параметрами</a><br /><div id="result"></div><a href="http://flapps.ru">http://flapps.ru</a></body></html>
Скрипт addlink.php должен возвращать данные в формате json.

Код: Выделить всё

// просто выводим сообщениеecho '{"success":                {                "msg":"Всё прошло успешно!"                }                }'; // сообщение с ошибкойecho '{"error":                {                "msg":"Произошла ошибка!"                }                }';
Подробнее о том как формировать ответ в json форамте можно прочитать в уроке Передача данных от сервера клиенту (XML, JSON).


Если нужно просто подгрузить данные, то можно использовать GET запрос.
Если нужно отправить какие-то данные на сервер, то лучше использовать POST запрос. POST запрос позволяет передавать данные большего объёма, при этом данные не кэшируются.


Чтобы увидеть разницу между запросами и отлавливать ошибки в процессе взаимодействия с сервером, прочтите урок Отладка приложений, взаимодействующих с сервером (Charles).

Re: Отправка GET и POST запросов с помощью jQuery

Добавлено: 17 июн 2011, 11:06
ukhov
Вот это хорошая тема.

Re: Отправка GET и POST запросов с помощью jQuery

Добавлено: 23 янв 2012, 14:36
Foxmen
а как картинку можно отправить ?

Re: Отправка GET и POST запросов с помощью jQuery

Добавлено: 23 янв 2012, 21:33
Александр
Foxmen
Поищи плагины "jquery file upload"

Re: Отправка GET и POST запросов с помощью jQuery

Добавлено: 13 апр 2012, 04:16
artemis
Александр,
а если гугл ругается на знак $ при включенной библиотеке?

Re: Отправка GET и POST запросов с помощью jQuery

Добавлено: 16 апр 2012, 20:45
Александр
artemis
Как ругается? Другие библиотеки используешь?

Re: Отправка GET и POST запросов с помощью jQuery

Добавлено: 23 май 2012, 22:16
T710MA
Какая максимальная длина строки JSON?

Re: Отправка GET и POST запросов с помощью jQuery

Добавлено: 23 май 2012, 22:26
alexei
T710MA писал(а):Какая максимальная длина строки JSON?
Сколько памяти хватит.