HTML-сообщение не работает - PullRequest
Новая
       0

HTML-сообщение не работает

0 голосов
/ 13 мая 2018

Я пытаюсь создать простой веб-сайт, который публикует информацию в API и показывает вывод в виде предупреждения.Но я не могу получить предупреждение.Код: 

<!DOCTYPE html>
    <html>
        <body>
            <b>Enter name</b>
            <br>
                <input type="text" id="name">
            <br>
            <button id="button1">Submit</button>
            <script
             src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"> 
            </script>
    <script>$('#button1').click(function(){
        $.ajax({
            type: "POST",
            url: "http://(api url)",
            data :{name:$('#name').value()},
        });
    });   
    </script>
    </body>
    </html>

Ответы [ 2 ]

0 голосов
/ 13 мая 2018

Вы очень близки, в вашем коде есть несколько проблем. Ваш data: {} выдает синтаксическую ошибку, поскольку .value() не существует, вместо этого вам нужно .val().

Чтобы отобразить результаты после успешного запроса к конечной точке API, необходим обратный вызов success, который можно записать, как показано ниже. Я использую тестовую фиктивную конечную точку POST по URL https://jsonplaceholder.typicode.com/posts в приведенном ниже коде, при необходимости замените ее на фактический URL, который вы запрашиваете: 

$('#button1').click(function(){
    $.ajax({
        type: "POST",
        url: "https://jsonplaceholder.typicode.com/posts",
        data :{name:$('#name').val()},
        success: function (data) {
        	alert(data);
        }
    });
});   
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<b>Enter name</b>
<br>
    <input type="text" id="name">
<br>
<button id="button1">Submit</button>
0 голосов
/ 13 мая 2018

Если вы хотите показать результат в оповещении, в этом случае вам нужно обработать обратный вызов, как показано ниже. 

  $.ajax({
      type: 'POST',
      url: "http://(api url)",
      data: {name:$('#name').val()}
      success: function(result) { alert(result) }
    });

успех Тип : Функция (Все данные, String textStatus, jqXHR jqXHR ) Функция, вызываемая в случае успешного выполнения запроса. Функция получает передал три аргумента: данные, возвращенные с сервера, отформатированы в соответствии с параметром dataType или обратным вызовом dataFilter функция, если указано; строка, описывающая статус; и JQXHR (в jQuery 1.4.x, XMLHttpRequest) объект. Начиная с jQuery 1.5, Успешная установка может принимать массив функций. Каждая функция будет быть вызванным по очереди

Обратите внимание, что value() - это ничто в jQuery, вам нужно использовать val()

Я предлагаю, наряду с успехом, вы также должны обработать ошибку следующим образом. 

error: function(XMLHttpRequest, textStatus, errorThrown) {
     alert("Some error occurred");
  }

Для получения более подробной информации о $ajax, я предлагаю вам ознакомиться с документацией здесь

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...