如何通过javascript发送数据使用帖子没有形式?

时间:2018-04-09 03:50:37

标签: javascript jquery html post get

我试着这样:

window.location = '/admin/product?name='+name+'&category='+category+'&createdAt='+createdAt;

如果语句执行,结果网址如下:

http://my-app.test/admin/product?name=chelsea&category=47&createdAt=2018-04-09

从url中,可以使用get来获取参数

的值

但我想改变它使用帖子。我不希望该值存在于网址

如何在没有javascript的表单标记的情况下执行此操作?

7 个答案:

答案 0 :(得分:1)

jQuery.ajax({
    url: '/admin/product',
    type: "post",
    data: { name, category, createdAt },
    dataType: "json",
    success:function(response)
    {
        if(response.result)
        {

        }
        else
        {

        }
    }
});

答案 1 :(得分:1)

fetch(URL, {
        method: 'POST',
        body: JSON.stringify({
            name: 'asif',
            email: 'asif@gmail.com'
        })
    }).then((response) => {
        return response.json();
    }).then((response) => {
        Console.log(response)
    }).catch((err) => {
        Console.log(err)
    });

答案 2 :(得分:1)

当您将数据放入URL时,您可以使用$ _GET或$ _REQUEST来获取数据。如果你想使用$ _POST方法获取数据,你需要传递使用post方法本身。如果您使用的是JQuery。我建议你去$ .ajax方法将数据发送到你想要的页面。但是你不会被重定向到那个页面。

如果您想要将数据发送到页面并且还想要重定向到页面以便在同一页面上进一步处理数据,您应该选择将数据放入$ _SESSION变量然后重定向到页面并在那里使用$ _SESSION变量。

我将提供一个简单的例子

要在主页上使用的AJAX

$.ajax({
    method:'post',
    url:'createSessionVariable.php',
    data:{data1:'dataOne', data2:'dataTwo'},
    success:function(){
        window.location.href='pageYouWantToGetRedirected.php';
    }
});

以上内容会将数据发送到页面 createSessionVariable.php ,您将使用php创建会话变量,然后成功时您将被重定向到 pageYouWantToGetRedirected.php

createSessionVariable.php上的代码

$_SESSION['data1'] = $_GET['data1'];
$_SESSION['data2'] = $_GET['data2'];
echo "Done";

现在,您可以在所需页面上使用会话变量。它将帮助您将变量传递到页面并重定向到页面,而无需使用表单标记。

但这不是一种编写代码的好方法,因为它可能会使您的网站容易受到攻击。你仍然可以使用它。

答案 3 :(得分:0)

请参阅here,jQuery' ajax可以为您查询和序列化您的查询参数:

$.ajax({
  url: '/admin/product',
  data: { name, category, createdAt },
  type: "POST",

答案 4 :(得分:0)

您可以使用Asynchrone Http请求,通常称为Ajax请求。有几种方法可以做到这一点: Using plain Javascript

var xmlhttp = new XMLHttpRequest();

xmlhttp.onreadystatechange = function() {
    if (xmlhttp.readyState == XMLHttpRequest.DONE) {   // XMLHttpRequest.DONE == 4
       if (xmlhttp.status == 200) {
           document.getElementById("myDiv").innerHTML = xmlhttp.responseText;
       }
       else if (xmlhttp.status == 400) {
          alert('There was an error 400');
       }
       else {
           alert('something else other than 200 was returned');
       }
    }
};

xmlhttp.open("GET", "http://my-app.test/admin/product?name=chelsea&category=47&createdAt=2018-04-09", true);
xmlhttp.send();

Or using Ajax

$.ajax({
 url: "http://my-app.test/admin/product?name=chelsea&category=47&createdAt=2018-04-09",
 cache: false,
 success: function(html){
    $("#results").append(html);
 }
});

我已经将问题与每种方法如何运作的良好解释联系起来。

答案 5 :(得分:0)

@ CertainPerformance的答案更好,但这是我的答案。

在后台使用表单标签始终是一个选项。

document.getElementById("name").value="Chelsea";
document.querySelectorAll("form")[0].submit();
<div style="display:none;">
<form action="product.php" method="post">
<input name="name" id="name">
<!--DO OTHER PARAMETERS-->
</form>
</div>

答案 6 :(得分:0)

使用javascript的XMLHttpRequest发送POST请求(无jQuery)

var http = new XMLHttpRequest();

var url = "/admin/product";
var params = 'name='+name+'&category='+category+'&createdAt='+createdAt;
http.open("POST", url, true);

//Send the proper header information along with the request
http.setRequestHeader("Content-type", "application/x-www-form-urlencoded");

http.onreadystatechange = function() {//Call a function when the state changes.
    if(http.readyState == 4 && http.status == 200) {
        alert(http.responseText);
    }
}
http.send(params);