子窗口给父窗口赋值实现思路及案例演示
更新时间:2013年01月27日 13:36:09 作者:
今天学习一下javascript实现从父窗口打开一个子窗口,在子窗口处理一些结果之后,把结果赋值于父窗口的文本框内,接下来介绍实现方法,感兴趣的朋友可以了解下,希望本文对你有所帮助
今天Insus.NET练习JavaScript,实现从父窗口打开一个子窗口,在子窗口处理一些结果之后,把结果赋值于父窗口的文本框内。可看效果:
在站点创建两个aspx页面,一个是PageA.aspx另一个是PageB.aspx:
在PageA.aspx的<head>节点内,写Javascript脚本,脚本有两个方法,一个是打开子窗口,一个是为文本框设值的方法:
<script type="text/javascript">
function popUp(url) {
objSubWin = window.open(url, "Popup", "toolbar=no,scrollbars=no,location=no,statusbar=no,menubar=no,resizable=0,width=300,height=80");
objSubWin.focus();
}
function SetValue(val) {
var amount = document.getElementById('<% = TextBoxAmount.ClientID %>');
amount.value = val;
}
</script>
然后在<body>节点内,拉一个TextBox和一个Button:
Amount:
<asp:TextBox ID="TextBoxAmount" runat="server" Enabled="false"></asp:TextBox>
<asp:Button ID="Button1" runat="server" Text="Call child window" OnClientClick="popUp('PageB.aspx')" />
OK,父页完成,接下来写PageB.aspx子页,还是先写Javascript脚本,也有两个函数,一个是验证文本框只能输入数字,另一个是计算方法,在calc()方法内,有呼叫到父窗口的方法。
<script type="text/javascript">
function isNumeric(keyCode) {
return ((keyCode >= 48 && keyCode <= 57) || keyCode == 8)
}
function calc() {
if (window.opener != null && !window.opener.closed) {
var qty = document.getElementById('<% = TextBoxqty.ClientID %>');
var price = document.getElementById('<% = TextBoxPrice.ClientID %>');
window.opener.SetValue(parseInt(qty.value) * parseInt(price.value));
}
}
</script>
在PageB.aspx的<body>节点内,拉两个文本框,一个Button铵钮。
数量<asp:TextBox ID="TextBoxqty" runat="server" onkeydown="return isNumeric(event.keyCode);" onpaste="return false;" Width="50"></asp:TextBox>
* 单价<asp:TextBox ID="TextBoxPrice" runat="server" onkeydown="return isNumeric(event.keyCode);" onpaste="return false;" Width="50"></asp:TextBox>
<asp:Button ID="Button1" runat="server" Text="Calculate" OnClientClick="calc()" />
另外附加,有关文本框验证的文章:https://www.jb51.net/article/33586.htm
在站点创建两个aspx页面,一个是PageA.aspx另一个是PageB.aspx:
在PageA.aspx的<head>节点内,写Javascript脚本,脚本有两个方法,一个是打开子窗口,一个是为文本框设值的方法:
复制代码 代码如下:
<script type="text/javascript">
function popUp(url) {
objSubWin = window.open(url, "Popup", "toolbar=no,scrollbars=no,location=no,statusbar=no,menubar=no,resizable=0,width=300,height=80");
objSubWin.focus();
}
function SetValue(val) {
var amount = document.getElementById('<% = TextBoxAmount.ClientID %>');
amount.value = val;
}
</script>
然后在<body>节点内,拉一个TextBox和一个Button:
复制代码 代码如下:
Amount:
<asp:TextBox ID="TextBoxAmount" runat="server" Enabled="false"></asp:TextBox>
<asp:Button ID="Button1" runat="server" Text="Call child window" OnClientClick="popUp('PageB.aspx')" />
OK,父页完成,接下来写PageB.aspx子页,还是先写Javascript脚本,也有两个函数,一个是验证文本框只能输入数字,另一个是计算方法,在calc()方法内,有呼叫到父窗口的方法。
复制代码 代码如下:
<script type="text/javascript">
function isNumeric(keyCode) {
return ((keyCode >= 48 && keyCode <= 57) || keyCode == 8)
}
function calc() {
if (window.opener != null && !window.opener.closed) {
var qty = document.getElementById('<% = TextBoxqty.ClientID %>');
var price = document.getElementById('<% = TextBoxPrice.ClientID %>');
window.opener.SetValue(parseInt(qty.value) * parseInt(price.value));
}
}
</script>
在PageB.aspx的<body>节点内,拉两个文本框,一个Button铵钮。
复制代码 代码如下:
数量<asp:TextBox ID="TextBoxqty" runat="server" onkeydown="return isNumeric(event.keyCode);" onpaste="return false;" Width="50"></asp:TextBox>
* 单价<asp:TextBox ID="TextBoxPrice" runat="server" onkeydown="return isNumeric(event.keyCode);" onpaste="return false;" Width="50"></asp:TextBox>
<asp:Button ID="Button1" runat="server" Text="Calculate" OnClientClick="calc()" />
另外附加,有关文本框验证的文章:https://www.jb51.net/article/33586.htm
相关文章
aspxgridview CustomButtonCallback 不支持弹出消息提示解决方法
aspxgridveiw是devexpress的一个grid控件,使用起来还不错,不能再 CustomButtonCallback 事件中使用response.write,具体的解决方法如下,感兴趣的朋友可以参考下哈2013-06-06
asp.net 关于==?:和if()else()条件判断等效例子
关于==?:和if()else() 等效例子2010-03-03
DataGridView - DataGridViewCheckBoxCell的使用介绍
Datagridview是.net中最复杂的控件,Datagridview中,用户可以对行、列、单元格进行编程,下面与大家分享下DataGridViewCheckBoxCell的使用,感兴趣的朋友可以参考下哈2013-06-06
asp.net中通过DropDownList的值去控制TextBox是否可编写的实现代码
Web窗体上有两控件,DropDownList1,TextBox1,当DropDownList的值选择是YES的时候,TextBox1可编辑,当选择NO的时候,TextBox1的值为空,并且不能编辑,该如何实现2012-11-11


最新评论