我正在尝试将浏览器指向另一个页面。如果我想要GET请求,我可以说
document.location.href = 'http://example.com/q=a';
但是,除非我使用POST请求,否则我试图访问的资源将无法正确响应。如果这不是动态生成的,我可能会使用HTML
<form action="http://example.com/" method="POST">
<input type="hidden" name="q" value="a">
</form>
然后我只需从DOM提交表单。
但实际上,我希望JavaScript代码能够让我说
post_to_url('http://example.com/', {'q':'a'});
最好的跨浏览器实现是什么?
我需要一个改变浏览器位置的解决方案,就像提交表单一样。这不应该是异步的,也不应该使用XML,因此Ajax不是答案。
不可以。您不能像提交表单一样提交JavaScript发布请求。
您可以拥有HTML格式的表单,然后使用JavaScript提交它。(如本页多次所述)。
您可以自己创建HTML,不需要JavaScript来编写HTML。如果有人这样建议,那就太傻了。
<form id="ninja" action="http://example.com/" method="POST">
<input id="donaldduck" type="hidden" name="q" value="a">
</form>
您的函数将按照您想要的方式配置表单。
function postToURL(a,b,c){
document.getElementById("ninja").action = a;
document.getElementById("donaldduck").name = b;
document.getElementById("donaldduck").value = c;
document.getElementById("ninja").submit();
}
然后,像这样使用它。
postToURL("http://example.com/","q","a");
但我会省略函数,只做。
document.getElementById('donaldduck').value = "a";
document.getElementById("ninja").submit();
最后,样式决定在ccs文件中。
#ninja {
display: none;
}
就我个人而言,我认为表格应该用名字来称呼,但现在这并不重要。
在表单中动态创建<input>并提交
/**
* sends a request to the specified url from a form. this will change the window location.
* @param {string} path the path to send the post request to
* @param {object} params the parameters to add to the url
* @param {string} [method=post] the method to use on the form
*/
function post(path, params, method='post') {
// The rest of this code assumes you are not using a library.
// It can be made less verbose if you use one.
const form = document.createElement('form');
form.method = method;
form.action = path;
for (const key in params) {
if (params.hasOwnProperty(key)) {
const hiddenField = document.createElement('input');
hiddenField.type = 'hidden';
hiddenField.name = key;
hiddenField.value = params[key];
form.appendChild(hiddenField);
}
}
document.body.appendChild(form);
form.submit();
}
例子:
post('/contact/', {name: 'Johnny Bravo'});
编辑:既然这件事得到了如此多的支持,我猜人们会大量复制粘贴这件事。所以我添加了hasOwnProperty检查,以修复任何意外的错误。
最简单的方法是使用Ajax Post Request:
$.ajax({
type: "POST",
url: 'http://www.myrestserver.com/api',
data: data,
success: success,
dataType: dataType
});
哪里:
数据是一个对象dataType是服务器期望的数据(xml,json、脚本、文本、html)url是RESt服务器或服务器端接受HTTP-POST的任何函数的地址。
然后在成功处理程序中使用类似window.location的内容重定向浏览器。
下面是我如何使用jQuery编写它的。在Firefox和Internet Explorer中测试。
function postToUrl(url, params, newWindow) {
var form = $('<form>');
form.attr('action', url);
form.attr('method', 'POST');
if(newWindow){ form.attr('target', '_blank');
}
var addParam = function(paramName, paramValue) {
var input = $('<input type="hidden">');
input.attr({ 'id': paramName,
'name': paramName,
'value': paramValue });
form.append(input);
};
// Params is an Array.
if(params instanceof Array){
for(var i=0; i<params.length; i++) {
addParam(i, params[i]);
}
}
// Params is an Associative array or Object.
if(params instanceof Object) {
for(var key in params){
addParam(key, params[key]);
}
}
// Submit the form, then remove it from the page
form.appendTo(document.body);
form.submit();
form.remove();
}