我创建了一个框架集,其中一个框架使用 window.open 打开一个弹出窗口。在打开的那个窗口中,我有一个表单来收集用户的输入。我试图返回给父但失败的输入。任何帮助。 我尝试使用 window.opener 使用此解决方案:Popup window to return data to parent on close 但未能将 getChoice() 结果返回到父页面。
框架:
<form>
<button type="button" id="opener" onClick="lapOptionWindow('form.html','', '400','200');">Opinion </button>
</form>
框架js:
function lapOptionWindow(url, title, w, h) {
var left = (screen.width/2)-(w/2);
var top = (screen.height/2)-(h/2);
return window.open(url, title,'toolbar=no,location=no,directories=no, status=no, menubar=no, scrollbars=no,resizable=no, copyhistory=no, width='+w+', height='+h+', top='+top+', left='+left);
}
form.html(打开的窗口):
<div id="lightbox">
<strong>Chinese/Portuguese: Chinese<input type="radio" name="chorpor" value="" id="choice1"> Portuguese<input type="radio" name="chororpor" value="" id="choice2"></strong>
</br><button type="button" id="food" onclick="getChoice()">Submit</button>
</div>
表单.js:
function getChoice() {
var choice = "";
var choice1 = document.getElementById("choice1 ");
choice = choice1.checked == true ? "Chinese" : "Portuguese";
return choice;
}
最佳答案
这里有一个建议(我改了一些小东西,请注意):
parent.html
的主体:
<button type="button" onclick="popup('popup.html', '', 400, 200);">Opinion</button>
=>
<span id="choiceDisplay">No choice.</span>
parent.html
的 JavaScript:
function popup(url, title, width, height) {
var left = (screen.width/2) - (width/2);
var top = (screen.height/2) - (height/2);
var options = '';
options += 'toolbar=no,location=no,directories=no,status=no';
options += ',menubar=no,scrollbars=no,resizable=no,copyhistory=no';
options += ',width=' + width;
options += ',height=' + height;
options += ',top=' + top;
options += ',left=' + left;
return window.open(url, title, options);
}
function setLang(choice) {
var languages = {
'en': 'English',
'fr': 'French',
'ch': 'Chinese',
'por': 'Portugese'
};
var choiceMessage = 'You have chosen "' + languages[choice] + '".';
document.getElementById('choiceDisplay').innerHTML = choiceMessage;
}
popup.html
的主体:
<form name="f" onsubmit="sendChoiceAndClose()">
<fieldset><legend>Chinese/Portuguese</legend>
<p><input type="radio" name="lang" value="ch" checked>Chinese</p>
<p><input type="radio" name="lang" value="por">Portuguese</p>
<p><input type="submit" /></p>
</fieldset>
</form>
popup.html
的 JavaScript:
function sendChoiceAndClose() {
var form = document.forms['f'];
var choice = form.lang.value;
opener.setLang(choice);
this.close();
}
这是结果的概述:
因此,为了给出一个简短的解释,从弹出窗口调用 opener
窗口中定义的 JavaScript 函数以发送回选择信息。
但要小心,如果调用的 JavaScript 包含阻塞代码(例如 alert(...)
),弹出窗口将仅在阻塞代码完成后关闭(即在例如,alert
窗口已关闭)。
关于javascript - 将输入从 window.open 传递到父页面,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32617149/