Javascript window.open 使用 POST 传递值
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/5684303/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Javascript window.open pass values using POST
提问by php-b-grader
I have a javascript function that uses window.open to call another page and returning the result.
我有一个 javascript 函数，它使用 window.open 调用另一个页面并返回结果。
Here is the section of my code:
这是我的代码部分：
var windowFeatures = "status=0, toolbar=0, location=0, menubar=0, directories=0, resizable=1, scrollbars=1";
window.open ('http://www.domain.com/index.php?p=view.map&coords=' + encodeURIComponent(coords), 'JobWindow', windowFeatures);
My problem now is that I am passing to much data for the GET to handle and I need to pass it using the POST method.
我现在的问题是我正在传递大量数据以供 GET 处理，我需要使用 POST 方法传递它。
How can I convert the code above to open the page using the POST method without implement forms all over the page (the page lists 100's of orders with a list of suppliers - I am trying to map the suppliers)
如何将上面的代码转换为使用 POST 方法打开页面而不在整个页面上实现表单（页面列出了 100 个带有供应商列表的订单 - 我正在尝试映射供应商）
采纳答案by php-b-grader
I used a variation of the above but instead of printing html I built a form and submitted it to the 3rd party url:
我使用了上述的变体，但我没有打印 html，而是构建了一个表单并将其提交给第 3 方 url：
var mapForm = document.createElement("form");
mapForm.target = "Map";
mapForm.method = "POST"; // or "post" if appropriate
mapForm.action = "http://www.url.com/map.php";
var mapInput = document.createElement("input");
mapInput.type = "text";
mapInput.name = "addrs";
mapInput.value = data;
mapForm.appendChild(mapInput);
document.body.appendChild(mapForm);
map = window.open("", "Map", "status=0,title=0,height=600,width=800,scrollbars=1");
if (map) {
mapForm.submit();
} else {
alert('You must allow popups for this map to work.');
}
回答by Facundo Victor
Thank you php-b-grader. I improved the code, it is not necessary to use window.open(), the targetis already specified in the form.
谢谢php-b-grader。我改进了代码，没有必要使用window.open()，目标已经在表单中指定了。
// Create a form
var mapForm = document.createElement("form");
mapForm.target = "_blank";
mapForm.method = "POST";
mapForm.action = "abmCatalogs.ftl";
// Create an input
var mapInput = document.createElement("input");
mapInput.type = "text";
mapInput.name = "variable";
mapInput.value = "lalalalala";
// Add the input to the form
mapForm.appendChild(mapInput);
// Add the form to dom
document.body.appendChild(mapForm);
// Just submit
mapForm.submit();
for target options --> w3schools - Target
对于目标选项 --> w3schools - 目标
回答by reformed
For what it's worth, here's the previously provided code encapsulated within a function.
值得一提的是，这里是之前提供的封装在函数中的代码。
openWindowWithPost("http://www.example.com/index.php", {
p: "view.map",
coords: encodeURIComponent(coords)
});
Function definition:
函数定义：
function openWindowWithPost(url, data) {
var form = document.createElement("form");
form.target = "_blank";
form.method = "POST";
form.action = url;
form.style.display = "none";
for (var key in data) {
var input = document.createElement("input");
input.type = "hidden";
input.name = key;
input.value = data[key];
form.appendChild(input);
}
document.body.appendChild(form);
form.submit();
document.body.removeChild(form);
}
回答by PeterPink
thanks php-b-grader !
感谢 php-b-grader ！
below the generic function for window.open pass values using POST:
在 window.open 使用 POST 传递值的通用函数下方：
function windowOpenInPost(actionUrl,windowName, windowFeatures, keyParams, valueParams)
{
var mapForm = document.createElement("form");
var milliseconds = new Date().getTime();
windowName = windowName+milliseconds;
mapForm.target = windowName;
mapForm.method = "POST";
mapForm.action = actionUrl;
if (keyParams && valueParams && (keyParams.length == valueParams.length)){
for (var i = 0; i < keyParams.length; i++){
var mapInput = document.createElement("input");
mapInput.type = "hidden";
mapInput.name = keyParams[i];
mapInput.value = valueParams[i];
mapForm.appendChild(mapInput);
}
document.body.appendChild(mapForm);
}
map = window.open('', windowName, windowFeatures);
if (map) {
mapForm.submit();
} else {
alert('You must allow popups for this map to work.');
}}
回答by early
Even though this question was long time ago, thanks all for the inputs that helping me out a similar problem. I also made a bit modification based on the others' answers here and making multiple inputs/valuables into a Single Object (json); and hope this helps someone.
尽管这个问题是很久以前的问题，但感谢所有帮助我解决类似问题的输入。我还根据其他人的答案进行了一些修改，并将多个输入/值放入单个对象（json）中；并希望这对某人有所帮助。
js:
js：
//example: params={id:'123',name:'foo'};
mapInput.name = "data";
mapInput.value = JSON.stringify(params);
php:
php:
$data=json_decode($_POST['data']);
echo $data->id;
echo $data->name;
回答by Nikz
The code helped me to fulfill my requirement.
该代码帮助我满足了我的要求。
I have made some modifications and using a form I completed this. Here is my code-
我做了一些修改并使用我完成的表格。这是我的代码-
Need a 'target' attribute for 'form' -- that's it!
'form' 需要一个 'target' 属性——就是这样！
Form
形式
<form id="view_form" name="view_form" method="post" action="view_report.php" target="Map" >
<input type="text" value="<?php echo $sale->myvalue1; ?>" name="my_value1"/>
<input type="text" value="<?php echo $sale->myvalue2; ?>" name="my_value2"/>
<input type="button" id="download" name="download" value="View report" onclick="view_my_report();" />
</form>
JavaScript
JavaScript
function view_my_report() {
var mapForm = document.getElementById("view_form");
map=window.open("","Map","status=0,title=0,height=600,width=800,scrollbars=1");
if (map) {
mapForm.submit();
} else {
alert('You must allow popups for this map to work.');
}
}
Full code is explained showing normal form and form elements.
解释完整代码，显示正常表单和表单元素。
