[英]Window.open and pass parameters by post method
使用 window.open 方法，我打開帶有參數的新站點，我必須通過 post 方法傳遞這些參數。我找到了解決方案，但不幸的是它不起作用。 這是我的代碼：
<script type="text/javascript">
function openWindowWithPost(url,name,keys,values)
{
var newWindow = window.open(url, name);
if (!newWindow) return false;
var html = "";
html += "<html><head></head><body><form id='formid' method='post' action='" + url +"'>";
if (keys && values && (keys.length == values.length))
for (var i=0; i < keys.length; i++)
html += "<input type='hidden' name='" + keys[i] + "' value='" + values[i] + "'/>";
html += "</form><script type='text/javascript'>document.getElementById(\"formid\").submit()</sc"+"ript></body></html>";
newWindow.document.write(html);
return newWindow;
}
</script>
接下來，我創建數組：
<script type="text/javascript">
var values= new Array("value1", "value2", "value3")
var keys= new Array("a","b","c")
</script>
並通過以下方式調用函數：
<input id="Button1" type="button" value="Pass values" onclick="openWindowWithPost('test.asp','',keys,values)" />
但是，當我單擊此按鈕時，站點 test.asp 是空的（當然我嘗試獲取傳遞值 - Request.Form("b") ）。
我該如何解決這個問題，為什么我無法獲得傳遞值？
無需將表單寫入新窗口（這很難正確正確，在 HTML 代碼中對值進行編碼），只需打開一個空窗口並向其發送表單即可。
例子：
<form id="TheForm" method="post" action="test.asp" target="TheWindow">
<input type="hidden" name="something" value="something" />
<input type="hidden" name="more" value="something" />
<input type="hidden" name="other" value="something" />
</form>
<script type="text/javascript">
window.open('', 'TheWindow');
document.getElementById('TheForm').submit();
</script>
要動態設置表單中的值，您可以這樣做：
function openWindowWithPost(something, additional, misc) {
var f = document.getElementById('TheForm');
f.something.value = something;
f.more.value = additional;
f.other.value = misc;
window.open('', 'TheWindow');
f.submit();
}
要發布表單，請使用值調用函數，例如openWindowWithPost('a','b','c'); .
注意：我改變了與表單名稱相關的參數名稱，以表明它們不必相同。 通常，您會使它們彼此相似，以便更輕松地跟蹤值。
由於您希望在 javascript 中包含整個表單，而不是將其寫在標簽中，您可以這樣做：
let windowName = 'w_' + Date.now() + Math.floor(Math.random() * 100000).toString();
var form = document.createElement("form");
form.setAttribute("method", "post");
form.setAttribute("action", "openData.do");
form.setAttribute("target", windowName);
var hiddenField = document.createElement("input");
hiddenField.setAttribute("type", "hidden");
hiddenField.setAttribute("name", "message");
hiddenField.setAttribute("value", "val");
form.appendChild(hiddenField);
document.body.appendChild(form);
window.open('', windowName);
form.submit();
我完全同意上面發布的mercenary的回答，並為我創建了這個對我有用的功能。 這不是答案，而是雇佣兵對上述帖子的評論
function openWindowWithPostRequest() {
var winName='MyWindow';
var winURL='search.action';
var windowoption='resizable=yes,height=600,width=800,location=0,menubar=0,scrollbars=1';
var params = { 'param1' : '1','param2' :'2'};
var form = document.createElement("form");
form.setAttribute("method", "post");
form.setAttribute("action", winURL);
form.setAttribute("target",winName);
for (var i in params) {
if (params.hasOwnProperty(i)) {
var input = document.createElement('input');
input.type = 'hidden';
input.name = i;
input.value = params[i];
form.appendChild(input);
}
}
document.body.appendChild(form);
window.open('', winName,windowoption);
form.target = winName;
form.submit();
document.body.removeChild(form);
}
盡管我遲到了 3 年，但為了簡化 Guffa 的示例，您甚至根本不需要頁面上的表單：
$('<form method="post" action="test.asp" target="TheWindow">
<input type="hidden" name="something" value="something">
...
</form>').submit();
編輯：
$('<form method="post" action="test.asp" target="TheWindow">
<input type="hidden" name="something" value="something">
...
</form>').appendTo('body').submit().remove();
也許對某人有用的提示:)
您可以簡單地在表單上使用target="_blank" 。
<form action="action.php" method="post" target="_blank">
<input type="hidden" name="something" value="some value">
</form>
以您喜歡的方式添加隱藏輸入，然后只需使用 JS 提交表單。
我創建了一個函數來生成一個表單，基於 url、目標和一個對象作為POST / GET數據和提交方法。 它支持該對象內的嵌套和混合類型，因此它可以完全復制您提供給它的任何結構：PHP 自動解析它並將其作為嵌套數組返回。 但是，有一個限制：方括號[和]不能是對象中任何鍵的一部分（例如{"this [key] is problematic" : "hello world"} ）。 如果有人知道如何正確逃脫它，請告訴！
廢話不多說，源碼如下：
function getForm(url, target, values, method) { function grabValues(x) { var path = []; var depth = 0; var results = []; function iterate(x) { switch (typeof x) { case 'function': case 'undefined': case 'null': break; case 'object': if (Array.isArray(x)) for (var i = 0; i < x.length; i++) { path[depth++] = i; iterate(x[i]); } else for (var i in x) { path[depth++] = i; iterate(x[i]); } break; default: results.push({ path: path.slice(0), value: x }) break; } path.splice(--depth); } iterate(x); return results; } var form = document.createElement("form"); form.method = method; form.action = url; form.target = target; var values = grabValues(values); for (var j = 0; j < values.length; j++) { var input = document.createElement("input"); input.type = "hidden"; input.value = values[j].value; input.name = values[j].path[0]; for (var k = 1; k < values[j].path.length; k++) { input.name += "[" + values[j].path[k] + "]"; } form.appendChild(input); } return form; }
用法示例：
var obj = { "a": [1, 2, [3, 4]], "b": "a", "c": { "x": [1], "y": [2, 3], "z": [{ "a": "Hello", "b": "World" }, { "a": "Hallo", "b": "Welt" }] } }; var form = getForm("http://example.com", "_blank", obj, "post"); document.body.appendChild(form); form.submit(); form.parentNode.removeChild(form);
我找到了一種將參數傳遞給彈出窗口甚至從中檢索參數的更好方法：
在主頁面：
var popupwindow;
var sharedObject = {};
function openPopupWindow()
{
// Define the datas you want to pass
sharedObject.var1 =
sharedObject.var2 =
...
// Open the popup window
window.open(URL_OF_POPUP_WINDOW, NAME_OF_POPUP_WINDOW, POPUP_WINDOW_STYLE_PROPERTIES);
if (window.focus) { popupwindow.focus(); }
}
function closePopupWindow()
{
popupwindow.close();
// Retrieve the datas from the popup window
= sharedObject.var1;
= sharedObject.var2;
...
}
在彈出窗口中：
var sharedObject = window.opener.sharedObject;
// function you have to to call to close the popup window
function myclose()
{
//Define the parameters you want to pass to the main calling window
sharedObject.var1 =
sharedObject.var2 =
...
window.opener.closePopupWindow();
}
而已 ！
這非常方便，因為：
玩得開心！
我想在 React 中使用普通的 Js 和 fetch polyfill來做到這一點。 OP 沒有說他特別想創建一個表單並在其上調用 submit 方法，所以我通過將表單值發布為 json 來完成它：
examplePostData = {
method: 'POST',
headers: {
'Content-type' : 'application/json',
'Accept' : 'text/html'
},
body: JSON.stringify({
someList: [1,2,3,4],
someProperty: 'something',
someObject: {some: 'object'}
})
}
asyncPostPopup = () => {
//open a new window and set some text until the fetch completes
let win=window.open('about:blank')
writeToWindow(win,'Loading...')
//async load the data into the window
fetch('../postUrl', this.examplePostData)
.then((response) => response.text())
.then((text) => writeToWindow(win,text))
.catch((error) => console.log(error))
}
writeToWindow = (win,text) => {
win.document.open()
win.document.write(text)
win.document.close()
}
默認提交操作是 Ext.form.action.Submit，它使用 Ajax 請求將表單的值提交到配置的 URL。 要啟用 Ext 表單的正常瀏覽器提交，請使用標准提交配置選項。
鏈接： http : //docs.sencha.com/extjs/4.2.1/#!/api/Ext.form.Basic-cfg-standardSubmit
解決方案：將 standardSubmit :true 放入您的配置中。 希望這會幫助你:)
我過去使用過這個，因為我們通常使用 razor 語法進行編碼
@using (Html.BeginForm("actionName", "controllerName", FormMethod.Post, new { target = "_blank" }))
{
// 在此處添加隱藏和表單提交
}
使用JavaScript在window.open方法中傳遞參數（左，上限值）
[英]Pass parameters (left, top values) in window.open method with javascript
如何在window.open方法中將動態PHP變量作為參數傳遞
[英]How to pass dynamic PHP variable as parameter in window.open method
如何將用戶腳本發布到 angularJS 中的 $window.open 方法
[英]How to post User scripts to $window.open method in angularJS
需要window.open，showmodeldialog和startDownload的替代POST方法
[英]Need alternative POST method for window.open, showmodeldialog and startDownload
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.