Javascript 使用 jQuery 在父窗口和子弹出窗口之间传递数据
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/4350223/
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
Passing data between a parent window and a child popup window with jQuery
提问by mhenry
I have the following HTML
我有以下 HTML
<tr>
<td class="label" valign="top">
Affiliate Party
</td>
<td class="field">
<input type="hidden" name="ctl00$MainContent$ExternalAccountAttributes$AffiliatePartyId" id="AffiliatePartyId" />
<input name="ctl00$MainContent$ExternalAccountAttributes$AffiliatePartyName" type="text" id="AffiliatePartyName" class="PartyLookup" />
</td>
</tr>
and the following Javascript/jQuery
和以下 Javascript/jQuery
$(".PartyLookup").after("<img src='Images/book_open.png' class='PartyLookupToggle' style='padding-left:4px;' />");
$(".PartyLookupToggle").click(function () {
window.open("PartySearch.aspx", "PartySearch", "width=400,height=50");
return false;
});
I need to be able to flag ANY PartyId input field with class="PartyLookup" so that it will modify the DOM and include the image next to the input field. The popup window returns data to populate both the hidden and text fields, but since the click() is generic I need to pass it the ID of the input field. I have no idea how to do this. Any suggestions?
我需要能够用 class="PartyLookup" 标记任何 PartyId 输入字段，以便它修改 DOM 并在输入字段旁边包含图像。弹出窗口返回数据以填充隐藏字段和文本字段，但由于 click() 是通用的，我需要将输入字段的 ID 传递给它。我不知道该怎么做。有什么建议？
回答by mhenry
Script on parent page:
父页面上的脚本：
$(".PartyLookupToggle").click(function () {
var id = $(this).prev().prev().attr("id");
var name = $(this).prev().attr("id");
var url = "PartySearch.aspx?id=" + id + "&name=" + name;
window.open(url, "PartySearch", "width=400,height=50");
return false;
});
Script on child page:
子页面上的脚本：
// Get the values from the URL using the jquery.query plug-in
var id = $.query.get("id");
var name = $.query.get("name");
// Get the values from the drop down
var newPartyId = $("#ddlMatchingParties").val();
var newPartyName = $("#ddlMatchingParties option:selected").text();
// Set them to the parent window
window.opener.$("#" + id).val(newPartyId);
window.opener.$("#" + name).val(newPartyName);
// Close the popup
window.close();
回答by Adrian Ondarza
It's very simple with jQuery, in your child window (popup) call your parent window objects there:
使用 jQuery 非常简单，在您的子窗口（弹出窗口）中调用您的父窗口对象：
$("#txtCodCliente", opener.window.document).val("VALUE TO "); //assign
$("#btnSelCliente", opener.window.document).click();
with opener.window.documentwe tell to jQuery that the object is in window that opens the popup.
与opener.window.document我们告诉jQuery的对象是在打开的弹出窗口。
回答by Ender
Have a look at this instructional article: http://www.plus2net.com/javascript_tutorial/window-child3.php
看看这篇教学文章：http: //www.plus2net.com/javascript_tutorial/window-child3.php
Essentially, you need to do this in the child window's form. You'll be passing a value like so:
本质上，您需要在子窗口的窗体中执行此操作。您将传递这样的值：
opener.document.f1.p_name.value="Any value";
Where f1is the ID of the form in the parent window and p_nameis the name of the field in the form.
其中f1是父窗口中表单的ID， 是表单中p_name字段的名称。
Once you have the value in a field on the parent, you can do whatever you like with it.
一旦您在父级的字段中拥有值，您就可以对它做任何您喜欢的事情。
EDIT:
编辑：
To pass info to the child window, the easiest method would probably be via query string, and then read the query string from the child window. In this case, probably something like:
要将信息传递给子窗口，最简单的方法可能是通过查询字符串，然后从子窗口读取查询字符串。在这种情况下，可能类似于：
$(".PartyLookupToggle").click(function () {
window.open("PartySearch.aspx?id=" + $(this).prev().attr('id'), "PartySearch", "width=400,height=50");
return false;
});
