JQUERY. Метод $.post(), пример использования

Метод jQuery.post() для отправки POST-запросов

Метод jQuery.post( url, [data], [callback], [type] ) загружает страницу с помощью HTTP-запроса POST. Он возвращает объект XMLHttpRequest.

Синтаксис

Простой синтаксис для использования этого метода:

$.post( URL, [data], [callback], [type] )

Параметры

Описание всех параметров, используемых этим методом:

• URL — строка, содержащая URL-адрес, на который отправляется запрос.
• data (необязательный) — пары ключ/значение или возвращаемое значение функции .serialize(), которое будет отправлено на сервер.
• callback (необязательный) — функция, которая будет выполнена при успешной загрузке данных.
• type (необязательный) — тип данных, которые должны быть возвращены в функцию обратного вызова: "xml", "html", "script", "json", "jsonp" или "text".

Пример

Предположим, что у нас есть следующий код в файле result.php:

<?php
if ( $_REQUEST["name"] ) {
   $name = $_REQUEST['name'];
   echo "Привет, " . $name;
}
?>

Используем jQuery, чтобы передать имя в result.php со сторонней страницы:

<!DOCTYPE html>
<html>
<head>
   <script type="text/javascript" src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
   <script type="text/javascript">
      $(document).ready(function() {
         $("#button-id").click(function(event) {
            $.post(
               "result.php",
               { name: "Пользователь" },
               function(data) {
                  $('#text-id').html(data);
               }
            );
         });
      });
   </script>
</head>
<body>
   <p>Нажми на кнопку, чтобы увидеть результат!</p>
   <div id="text-id" style="background-color:#ccc;">
      Какой-то текст...
   </div>
   <input type="button" id="button-id" value="Клик" />
</body>
</html>

При клике на кнопку будет отправлен POST-запрос, и ответ сервера (строка "Привет, Пользователь") отобразится в <div>.