СКРИПТЫ
ТЕГИ:
php (315)
js (234)
html (145)
css (125)
html tags (62)
js tag (56)
jquery (41)
text (36)
js method (35)
php array (32)
js date (32)
form html (30)
fonts (27)
link (26)
Показать еще :
ruweb.net (25)
online (24)
foto (22)
php file (21)
atom (20)
forum (19)
svg (18)
hosting (17)
php date (17)
board (16)
input (16)
html book (16)
php time (16)
color (15)
js events (14)
js url (14)
htaccess (13)
osclass (13)
img (13)
js time (13)
notepad (13)
select (12)
dw block (12)
знак (12)
info (12)
php path (12)
php img (12)
table (12)
icon (11)
form (11)
jsphp (11)
download (11)
keyboard (11)
yandex (10)
js delete (10)
mouse (10)
hover (9)
dosite (8)
php url (7)
comment (7)
cookie (7)
mysql (6)
browser (6)
year (6)
list (6)
iframe (6)
php get (6)
click (6)
value (5)
mb (5)
adminka (5)
ftp (5)
search (5)
js id (5)
chart (5)
tag a (5)
heading (5)
reg.ru (4)
ucoz (4)
task (4)
week (4)
symbols (4)
нок (4)
submit (4)
js form (4)
ssl (4)
bbcode (4)
pages (4)
console (4)
day (4)
vk (4)
month (4)
base64 (4)
php var (4)
js hash (3)
captcha (3)
js math (3)
numbers (3)
куб (3)
padding (3)
line (3)
js img (3)
vs code (3)
js post (3)
scandir (3)
https (3)
seo (2)
sitemap (2)
prompt (2)
js vars (2)
video (2)
tag hr (2)
youtube (2)
qr kod (2)
google (2)
arrows (2)
typeof (2)
money (2)
рся (2)
height (2)
details (2)
domen (2)
counter (2)
cursor (1)
smile (1)
speed (1)
windows (1)
archive (1)
rutube (1)
нод (1)
scroll (1)
header (1)

Отправить POST-запрос через JavaScript

javascript post, или как "Отправить POST-запрос через JavaScript". С примерами.

Подробно о "javascript post"

  1. Отправить POST-запрос через JavaScript
  2. Функция post в JavaScript вместе с формой
  3. Пример отправки POST-запроса через JavaScript
  4. Ответ post js
  5. Скачать можно здесь

  1. Отправить POST-запрос через JavaScript

    Мы рассматривали ранее post в php - теперь пришло время разобраться в теме "post в JavaScript", не будем тянуть кота з хвост и приступим!
    Это самый простой пример, как работает "post в JavaScript"

    Что мы будем делать!? Начнем с алгоритма!

    Алгоритм отправки "post в JavaScript"

    Создадим файл php, где будет коротки код:

    <?
    $a = $_POST["a"] ;
    $b = $_POST["b"] ;
    echo $a + $b;

    Здесь на странице создадим форму с полями ввода.

    И здесь же напишем функцию, которая получит данные из формы, отправит их с помощью "post JavaScript".

    Она же получит ответ из файла и выведем результат действия в php файле.

    Функция "post в JavaScript"

    Создадим функцию post :

    function post() {}

    Получаем данные из полей ввода :

    var a = ida .value; // Считываем значение a
    var b = idb .value; // Считываем значение b

    В переменную "data" помещаем, конструкцию похожую на массив(но не массив) ключ = значение.

    var data = "a=" + encodeURIComponent(a) + "&b=" + encodeURIComponent(b);

    Создаём объект xhr:

    var xhr = new XMLHttpRequest();

    Открываем асинхронное соединение :

    xhr.open("POST", "https://dwweb.ru/путь до файла/example_post_js.php" , true);

    Отправляем кодировку :

    xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");

    Отправляем POST-запрос :

    xhr.send(data);

    Далее, не буду каждую строчку расписывать смотрим комментарии:

    xhr.onreadystatechange = function() // Ждём ответа от сервера
    {
      if (xhr.readyState == 4) // возвращает текущее состояние объекта(0-4)
      {
        if(xhr.status == 200) // код 200 (если страница не найдена вернет 404)
        {
          summa.innerHTML = xhr.responseText; // Выводим ответ сервера
        }
      }
    }

    Соберем функцию post в JavaScript в одно целое:


  2. Функция post в JavaScript вместе с формой:

    <script>

    function post()

    {

      var a = ida .value; // Считываем значение a

      var b = idb .value; // Считываем значение b

      var data = "a=" + encodeURIComponent(a) + "&b=" + encodeURIComponent(b);

      var xhr = new XMLHttpRequest();// Создаём объект xhr

      xhr.open("POST", "https://dwweb.ru/путь/example_post_js.php" , true);// Открываем асинхронное соединение

      xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");// Отправляем кодировку

      xhr.send(data); // Отправляем POST-запрос

      xhr.onreadystatechange = function() // Ждём ответа от сервера

      {

        if (xhr.readyState == 4) // возвращает текущее состояние объекта(0-4)

        {

          if(xhr.status == 200) // код 200 (если страница не найдена вернет 404)

          {

            summa.innerHTML = xhr.responseText; // Выводим ответ сервера

          }

        }

      }

    }

    </script>

    Простая форма для отправки "post в JavaScript"

    <input type="text" name="a" id="ida"><br>

    <input type="text" name="b" id="idb"><br>

    <input type="button" value="Сумма" onclick="post()">

    <p>Сумма равна: <span id="summa"></span></p>

    Смотри далее Живой пример отправки POST-запроса через JavaScript


  3. Ответ post js

    Один из поисковых запросов - "Ответ post js - что это вообще такое...?

    Дело в том, что в отличии от php post - вернуть и получить простым способом от отправленного "post массива" в javascript не существует.

    Но хотя, кто с этим сталкивался - это не кажется уж таким и сложным!

    Получаем ответ pos запроса javascript

    Если вы помните тот код, который я рассматривал выше...

    после строки "xhr.send(data);"

    Используем "onreadystatechange", для того, чтобы промониторить состояние "readyState"

    xhr.onreadystatechange = function() // Ждём ответа от сервера

    Далее условие на то, что внутри xhr.readyState. Состояние 4 означает, что запрос был отправлен, сервер завершил возврат ответа, а браузер завершил загрузку содержимого ответа - подробнее

    if (xhr.readyState == 4) // возвращает текущее состояние объекта(0-4)

    Теперь "status", если он равен 200, то все хорошо...

    if (xhr.status == 200) {

    Выводим результат или что там вам нужно... Например...

    alert (xhr.responseText);

    Если требуется вывести ошибку, то можно сделать else:

    alert( xhr.status + ': ' + xhr.statusText ); // пример вывода: 404: Not Found

    Итого - давайте соберем весь код ответа post js

    xhr.onreadystatechange = function() // Ждём ответа от сервера
    {
      if (xhr.readyState == 4) // возвращает текущее состояние объекта(0-4)
      {
        if(xhr.status == 200) // всё хорошо
        {
          alert (xhr.responseText); // Выводим ответ сервера
        }
        else
        {
          alert( xhr.status + ': ' + xhr.statusText ); // пример вывода: 404: Not Found
        }
      }
    }


  4. Пример отправки POST-запроса через JavaScript

    Теперь - нам осталось вставить данный код прямо сюда и теперь вы можете проверить, как работает отправка POST-запроса через JavaScript


    Сумма равна:

Можете не благодарить, лучше помогите!
Название скрипта :Отправить POST-запрос через JavaScript
Ссылка на скачивание : Все скрипты на одной странице
Теги :
post на чистом js
js post запрос
javascript post
javascript posting
javascript post запрос
javascript post form
javascript post request
отправить post javascript
отправка post javascript
javascript send post
xmlhttprequest javascript post
javascript отправка post запроса
javascript отправить post запрос
метод post javascript
javascript http post
как отправить post запрос javascript
пример пост запроса js
метод post javascript
post js
Еще никто не прокомментировал! COMMENTS+   BBcode
Подписаться + =

Счетчик в график :

Построение гравиков
Основа для графика : счетчик посещаемости.
На отдельной : странице.
Последние комментарии :
Марат :
18.11.2022 17:21
Как же я вами завидую! Сколько у вас свободного…
подробнее.
>" :
18.11.2022 17:18
Читать тяжело. Я еще фильтрацию тегов потыкаю, если вы не…
подробнее.
Марат :
18.11.2022 17:17
А как восклицательные знаки? С ними всё нормально??? Или нет??? Вы к ним как…
подробнее.
Марат :
18.11.2022 17:15
В мире много разных отклонений... по статистике примерно 10% человек в странах имеют такие.... Была у меня…
подробнее.
qwe"> :
18.11.2022 17:00
Читать тяжело. Я еще фильтрацию тегов потыкаю, если вы не…
подробнее.
Марат :
20.10.2022 10:10
Очень рад за Вас!
подробнее.
ruweb
Страница загружена за : 0.020994 секунд. Подробнее