是否可以将JSON格式的数据发送到没有表单的服务器?

时间:2018-01-14 18:10:57

标签: javascript jquery json ajax

这是我的HTML代码:

<div class="page__question">
    <ul>
        <li class="question__item" data-answer="A">Вариант А</li>
        <li class="question__item" data-answer="Б">Вариант Б</li>
        <li class="question__item" data-answer="В">Вариант В</li>
    </ul>
</div>

<div class="page__transition">
    <a href="#" class="btn">продолжить</a>
<div>

是否有可能以某种方式传递JSON中没有表单标记的“数据应答”中的值?

4 个答案:

答案 0 :(得分:1)

是的,使用带有ajax的jQuery,它非常简单。

 $('.btn').click(function() {
    var obj = [];
    for (var i = 0; i < $('.question__item').length; i++) {
        obj.push($($('.question__item')[i]).data('answear'));
    }
    $.ajax({
        url: '#',
        method: 'POST',
        data: {
            key: obj
        },
        success: function(resp) {

        }
    });
});

答案 1 :(得分:0)

您可以使用FormDataPOSTFormData对象和XMLHttpRequest() fetch()服务器上设置键值,值对。

&#13;
&#13;
const fd = new FormData();

for (let el of document.querySelectorAll(".question__item[data-answear]")) {
  fd.append(el.dataset.answear, el.textContent)
}

console.log([...fd]);

// fetch("/path/to/server", {method: "POST", body:fd})
// .then(response => console.log(response.ok))
// .catch(err => console.error(err))
&#13;
<div class="page__question">
  <ul>
    <li class="question__item" data-answear="A">Вариант А</li>
    <li class="question__item" data-answear="Б">Вариант Б</li>
    <li class="question__item" data-answear="В">Вариант В</li>
  </ul>
</div>

<div class="page__transition">
  <a href="#" class="btn">продолжить</a>
  <div>
&#13;
&#13;
&#13;

答案 2 :(得分:0)

当然这是可能的。大多数Web应用程序从客户端发送许多与用户输入无关的AJAX调用。 Fetch是一个相对较新的本机API,它利用promises并且比以前的实现更容易使用。

以下是使用fetch的示例:

var options = {
  method: 'POST',
  mode: 'cors',
  body: JSON.stringify({
    someKey: 'someValue'
  })
}

fetch('someUrl', options);
  .then( response => console.log(response) )
  .catch( error => console.log( error ) )

答案 3 :(得分:0)

是的,这是可能的。您可以将数据json发送到url,并在服务器端调用方法为您执行操作。这是发送json数据的简单示例。在此示例中,我发送userId作为删除用户的数据。

function removeUser(userId) {
    $.ajax({
        url: '/Admin/RemoveUser',
        dataType: "json",
        type: "POST",
        contentType: 'application/json; charset=utf-8',
        async: true,
        processData: false,
        cache: false,
        data: JSON.stringify({
            'userId': userId
        }),
        success: function (data) {
            alert('successfully removed');
        },
        error: function (xhr) {
            alert('error');
        }
    });
}

所以你可以发送任何你想要的东西。