【问题标题】:Passing data between a parent window and a child popup window with jQuery使用 jQuery 在父窗口和子弹出窗口之间传递数据
【发布时间】:2011-05-20 00:15:45
【问题描述】:

我有以下 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>

和下面的 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;
});

我需要能够使用 class="PartyLookup" 标记任何 PartyId 输入字段,以便它会修改 DOM 并将图像包含在输入字段旁边。弹出窗口返回数据以填充隐藏和文本字段,但由于 click() 是通用的,我需要将输入字段的 ID 传递给它。我不知道该怎么做。有什么建议吗?

【问题讨论】:

  • @micheel 即使在弹出窗口中您也可以访问完整的 dom ,,

标签: javascript asp.net jquery


【解决方案1】:

父页面上的脚本:

$(".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;
});

子页面上的脚本:

// 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();

【讨论】:

  • 谢谢!你是一个救生员!
  • .prev() 有什么作用?
  • @Jon 获取匹配元素集中每个元素的前一个兄弟元素:api.jquery.com/prev
  • 这是 StackOverflow 上最好的帖子之一,最好的帖子之一!救命稻草!
【解决方案2】:

使用 jQuery 非常简单,在您的子窗口(弹出窗口)中调用您的父窗口对象:

$("#txtCodCliente", opener.window.document).val("VALUE TO "); //assign

$("#btnSelCliente", opener.window.document).click();

通过opener.window.document,我们告诉 jQuery 对象在打开弹出窗口的窗口中。

【讨论】:

    【解决方案3】:

    看看这篇指导文章:http://www.plus2net.com/javascript_tutorial/window-child3.php

    本质上,您需要在子窗口的窗体中执行此操作。您将像这样传递一个值:

    opener.document.f1.p_name.value="Any value";
    

    其中f1 是父窗口中表单的ID,p_name 是表单中字段的名称。

    一旦你在父级的某个字段中获得了值,你就可以对它做任何你喜欢的事情。

    编辑:

    要将信息传递给子窗口,最简单的方法可能是通过查询字符串,然后从子窗口中读取查询字符串。在这种情况下,可能是这样的:

    $(".PartyLookupToggle").click(function () {
        window.open("PartySearch.aspx?id=" + $(this).prev().attr('id'), "PartySearch", "width=400,height=50");
        return false;
    });
    

    【讨论】:

    • 是的,我明白这一点。但是,我需要传递元素的 ID 是当前 $(this) 与子窗口相关联,这样当我返回值时,我知道表单元素的“p_name”。
    • 好的,但是鉴于我在上面的问题中发布的 HTML 结构,我需要找到一种 jQuery 方法来获取可点击图像左侧的文本字段的 ID(添加到DOM 由 jQuery)。
    • 再次编辑。只需使用.prev() 向后遍历文本字段,以获取其 ID。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2023-01-03
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多