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


Posted in Javascript onDecember 18, 2014

新建父窗口页面:

加入以下脚本

<html xmlns="http://www.w3.org/1999/xhtml" >

<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 id="form1" runat="server">

         <input id="Button1" type="button" value="button" onclick="ShowDialog('./second.aspx')" />

         <div><asp:TextBox ID="TextBox1" runat="server" Width="67px"></asp:TextBox></div>

     </form>

</body>

</html>

创建second.html页面:

<html xmlns="http://www.w3.org/1999/xhtml" >

<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 id="form1" runat="server">

    <div>

          <asp:DataGrid ID="dgSjygl" runat="server" AllowPaging="True" AutoGenerateColumns="False"

                        BackColor="White" Font-Size="9pt" PageSize="5" Width="100%" Height="127px" 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" id="myRadio" name="myRadio"  value='<%# DataBinder.Eval(Container.DataItem, "id") %>'>

                                </ItemTemplate>

                                <HeaderStyle Font-Bold="True" HorizontalAlign="Center" Width="60px" />

                                <ItemStyle HorizontalAlign="Center" />

                            </asp:TemplateColumn>

                            <asp:BoundColumn DataField="ID" HeaderText="编号">

                                <HeaderStyle Font-Bold="True"  Width="75px" HorizontalAlign="Center"/>

                            </asp:BoundColumn>

                            <asp:BoundColumn DataField="MC" HeaderText="名称">

                                <HeaderStyle Font-Bold="True"  Width="90px" 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 id="Btn_OK" type="button" onclick="OK()" value="确 定"/>

          <input id="Btn_Cancel" type="button" onclick="clickDiag()"  value="取 消" />

     </div>        

    </form>

</body>

</html>

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

Javascript 相关文章推荐
在网页里看flash的trace数据的js类
Jan 10 Javascript
jQuery效果 slideToggle() 方法(在隐藏和显示之间切换)
Jun 28 Javascript
详解jQuery插件开发中的extend方法
Nov 19 Javascript
JS字符串截取函数实例
Dec 27 Javascript
ie 7/8不支持trim的属性的解决方案
May 23 Javascript
AngularJS中的Directive实现延迟加载
Jan 25 Javascript
JS验证不重复验证码
Feb 10 Javascript
jQuery插件FusionCharts实现的Marimekko图效果示例【附demo源码】
Mar 24 jQuery
原生JS+HTML5实现的可调节写字板功能示例
Aug 30 Javascript
AngularJs返回前一页面时刷新一次前面页面的方法
Oct 09 Javascript
原生js实现淘宝放大镜效果
Oct 28 Javascript
vue实现在线预览pdf文件和下载(pdf.js)
Nov 26 Javascript
JavaScript获取Url里的参数
Dec 18 #Javascript
Javascript实现单张图片浏览
Dec 18 #Javascript
VS2008中使用JavaScript调用WebServices
Dec 18 #Javascript
JavaScript中window.showModalDialog()用法详解
Dec 18 #Javascript
JavaScript获取网页、浏览器、屏幕高度和宽度汇总
Dec 18 #Javascript
Js使用WScript.Shell对象执行.bat文件和cmd命令
Dec 18 #Javascript
使用jQuery jqPlot插件绘制柱状图
Dec 18 #Javascript
You might like
网友原创的PHP模板类代码
2008/09/07 PHP
php无限遍历目录示例
2014/02/21 PHP
PHP面向对象教程之自定义类
2014/06/10 PHP
php导入大量数据到mysql性能优化技巧
2014/12/29 PHP
PHP实现将视频转成MP4并获取视频预览图的方法
2015/03/12 PHP
PHP常用的小程序代码段
2015/11/14 PHP
js RuntimeObject() 获取ie里面自定义函数或者属性的集合
2010/11/23 Javascript
IE和Firefox的Javascript兼容性总结[推荐收藏]
2011/10/19 Javascript
一个JavaScript用逗号分割字符串实例
2014/09/22 Javascript
Javascript中Array用法实例分析
2015/06/13 Javascript
将JavaScript的jQuery库中表单转化为JSON对象的方法
2015/11/17 Javascript
JavaScript利用闭包实现模块化
2017/01/13 Javascript
js中小数向上取整数,向下取整数,四舍五入取整数的实现(必看篇)
2017/02/13 Javascript
Angular中的ng-template及angular 使用ngTemplateOutlet 指令的方法
2018/08/08 Javascript
vue 单页应用和多页应用的优劣
2020/10/22 Javascript
Python基于Tkinter的HelloWorld入门实例
2015/06/17 Python
python实现下载指定网址所有图片的方法
2015/08/08 Python
Python使用lxml模块和Requests模块抓取HTML页面的教程
2016/05/16 Python
通过5个知识点轻松搞定Python的作用域
2016/09/09 Python
tensorflow中next_batch的具体使用
2018/02/02 Python
关于django 数据库迁移(migrate)应该知道的一些事
2018/05/27 Python
Python 3.x 判断 dict 是否包含某键值的实例讲解
2018/07/06 Python
Django配置celery(非djcelery)执行异步任务和定时任务
2018/07/16 Python
Python3获取cookie常用三种方案
2020/10/05 Python
极简的HTML5模版
2015/07/09 HTML / CSS
Trip.com香港网站:Ctrip携程旗下,全球最大的网上旅游社之一
2016/08/01 全球购物
PHP开发的一般流程
2013/08/13 面试题
学徒工职责
2014/03/06 职场文书
岗位明星事迹材料
2014/05/18 职场文书
课外科技活动总结
2014/08/27 职场文书
关于晚自习早退的检讨书
2014/09/13 职场文书
优秀班集体申报材料
2014/12/25 职场文书
纪录片信仰观后感
2015/06/08 职场文书
优秀范文:读《红岩》有感3篇
2019/10/14 职场文书
特别篇动画《总之就是非常可爱 ~制服~》PV公开,2022年夏季播出
2022/04/04 日漫
如何使用SQL Server语句创建表
2022/04/12 SQL Server