JavaScript实现弹出子窗口并传值给父窗口

这篇文章主要介绍了JavaScript实现弹出子窗口并传值给父窗口,方法很简单,这里推荐给大家,需要的朋友可以参考下

新建父窗口页面:

加入以下脚本

复制代码 代码如下:


<html xmlns="" >
<head runat="server">
    <title>First</title>
</head>
<script type="text/javascript">
function ShowDialog(Url)
{
      var  iWidth=560; //模态窗口宽度
      var  iHeight=300;//模态窗口高度
      var  iTop=(window.screen.height-iHeight-100)/2;
      var  iLeft=(window.screen.width-iWidth)/2;
      var returnValue=window.showModalDialog(Url, "newwindow", "dialogHeight:"+iHeight+"px; dialogWidth:"+iWidth+"px; toolbar:no; menubar:no; scrollbars:no; resizable:no; location:no; status:no;left:200px;top:100px;");
      document.getElementById("TextBox1").innerText=returnValue;
}
</script>
<body>
    <form runat="server">
         <input type="button" value="button" />
         <div><asp:TextBox runat="server"></asp:TextBox></div>
     </form>
</body>
</html>

创建second.html页面:

复制代码 代码如下:


<html xmlns="" >
<head runat="server">
    <title>second</title>
    <!--<base target="_self" ></base>-->
</head>
<script language="javascript">
    function closeDiag()
    {
        window.opener=null;
        window.close();
    } 
    function OK()
    {
        var Value=document.getElementsByName("myRadio");
        for(var i=0;i<Value.length;i++)
        {
            if(Value[i].checked)
            { 
                window.returnValue = Value[i].value;
                window.close();
            }
            else
            {
                document.getElementById("Lab_Info").innerText="没有选中项,请选择!";
            }
        }     
    } 
</script>
<body>
    <form runat="server">
    <div>
          <asp:DataGrid runat="server" AllowPaging="True" AutoGenerateColumns="False"
                        BackColor="White" Font-Size="9pt" PageSize="5" OnItemDataBound="dgSjygl_ItemDataBound">
                        <PagerStyle Mode="NumericPages" />
                        <AlternatingItemStyle BackColor="Gainsboro" />
                        <ItemStyle BackColor="#EEEEEE" ForeColor="Black" HorizontalAlign="Center" />
                        <Columns>
                            <asp:TemplateColumn>            
                                <HeaderTemplate>
                                    <label>选择</label>
                                </HeaderTemplate>
                                <ItemTemplate>                                   
                                    <input type="radio"  value='<%# DataBinder.Eval(Container.DataItem, "id") %>'>
                                </ItemTemplate>
                                <HeaderStyle Font-Bold="True" HorizontalAlign="Center" />
                                <ItemStyle HorizontalAlign="Center" />
                            </asp:TemplateColumn>
                            <asp:BoundColumn DataField="ID" HeaderText="编号">
                                <HeaderStyle Font-Bold="True"  HorizontalAlign="Center"/>
                            </asp:BoundColumn>
                            <asp:BoundColumn DataField="MC" HeaderText="名称">
                                <HeaderStyle Font-Bold="True"  HorizontalAlign="Center"/>
                                <ItemStyle HorizontalAlign="Center" />
                            </asp:BoundColumn>
                            <asp:BoundColumn DataField="BT" HeaderText="标题">
                                <HeaderStyle Font-Bold="True" HorizontalAlign="Center"/>
                            </asp:BoundColumn>
                        </Columns>
                        <HeaderStyle BackColor="#7481BA" ForeColor="Yellow" Font-Bold="False" Font-Italic="False" Font-Overline="False" Font-Strikeout="False" Font-Underline="False" Font-Size="Small" />
                    </asp:DataGrid>
    </div>
    <div>
          <input type="button" value="确 定"/>
          <input type="button"  value="取 消" />
     </div>       
    </form>
</body>
</html>


以上就是本人实现这个简单功能的全部内容了,感觉应该还有更便捷的方法,有知道的小伙伴还请留言说明下。

您可能感兴趣的文章:

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/wgxfsw.html