导航到另一个页面,通过链接发送请求

Rav*_*avi 16 html javascript jquery post hyperlink

<html>
<head>
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>    
<script type="text/javascript">
    function DoPost(){
      $.post("index.html", { name: "John", time: "2pm" } );
   }
    </script>
</head>

<body>
<a href="javascript:DoPost()">GO</a>

</body>
</html>
Run Code Online (Sandbox Code Playgroud)

我做了功能,并试图调用该函数,该函数里面提到我提到的url和数据在这里.但是,这对我不起作用.

注意:即使我在帖子标题中提到过,我也想澄清一下,我想POST通过简单的超链接使用方法导航到另一个页面.

Sat*_*nix 16

创建一个包含您需要发送的所有数据的html表单,并将转发用户所需的页面指定为操作.

<form method="post" id="theForm" action="REDIRECT_PAGE.php">
Run Code Online (Sandbox Code Playgroud)

然后在该表单中放入一些隐藏的字段.

<input type="hidden" name="name" value="John">
<input type="hidden" name="time" value="2pm">
</form>
Run Code Online (Sandbox Code Playgroud)

将此内容包装在doRedirect函数中,重定向将在正确提交POST数据时生效.

document.getElementById('theForm').submit()
Run Code Online (Sandbox Code Playgroud)

作为旁注,如果您需要读取POST数据,您可能希望将用户重定向到.php页面而不是.html页面.这取决于您的服务器配置,但默认情况下,我认为您不能在.html文件中运行PHP代码.


rob*_*bie 8

我知道这个问题差不多已有4年了,而且已经有了一个公认的答案,但我想提供一个替代解决方案,并指出你的错误.

第1部分:解决方案

用于导航POST请求的传统解决方案是接受的答案使用的表单.我将在此基础上构建一个使用DOM以编程方式创建表单的解决方案.

var payload = {
  name: 'John',
  time: '2pm'
};
var form = document.createElement('form');
form.style.visibility = 'hidden'; // no user interaction is necessary
form.method = 'POST'; // forms by default use GET query strings
form.action = 'index.html';
for (key in Object.keys(payload)) {
  var input = document.createElement('input');
  input.name = key;
  input.value = payload[key];
  form.appendChild(input); // add key/value pair to form
}
document.body.appendChild(form); // forms cannot be submitted outside of body
form.submit(); // send the payload and navigate
Run Code Online (Sandbox Code Playgroud)

index.html根据你的原始代码使用,但我会接受接受的答案的建议,并使用PHP接受和处理POST数据.

第2部分:问题

原始解决方案的主要问题是它使用$.post了一个基于的辅助函数$.ajax.AJAX旨在用于从服务器检索数据并在当前页面中使用它,而不是导航到另一个页面.


Iam*_*ain 7

这应该可以正常工作。类似于一个答案,但更好。

var payload = {
  name: 'John',
  time: '2pm'
};
var form = document.createElement('form');
form.style.visibility = 'hidden';
form.method = 'POST';
form.action = link;
$.each(Object.keys(payload), function(index, key) {
var input = document.createElement('input');
    input.name = key;
    input.value = payload[key];
    form.appendChild(input)
});
document.body.appendChild(form);
form.submit();
Run Code Online (Sandbox Code Playgroud)