今天Insus.NET練習(xí)JavaScript，實(shí)現(xiàn)從父窗口打開一個(gè)子窗口，在子窗口處理一些結(jié)果之后，把結(jié)果賦值于父窗口的文本框內(nèi)。可看效果：
在站點(diǎn)創(chuàng)建兩個(gè)aspx頁面，一個(gè)是PageA.aspx另一個(gè)是PageB.aspx:
在PageA.aspx的head>節(jié)點(diǎn)內(nèi)，寫Javascript腳本，腳本有兩個(gè)方法，一個(gè)是打開子窗口，一個(gè)是為文本框設(shè)值的方法：
復(fù)制代碼 代碼如下:
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>節(jié)點(diǎn)內(nèi)，拉一個(gè)TextBox和一個(gè)Button:
復(fù)制代碼 代碼如下:
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腳本，也有兩個(gè)函數(shù)，一個(gè)是驗(yàn)證文本框只能輸入數(shù)字，另一個(gè)是計(jì)算方法，在calc()方法內(nèi)，有呼叫到父窗口的方法。
復(fù)制代碼 代碼如下:
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>節(jié)點(diǎn)內(nèi)，拉兩個(gè)文本框，一個(gè)Button銨鈕。
復(fù)制代碼 代碼如下:
數(shù)量asp:TextBox ID="TextBoxqty" runat="server" onkeydown="return isNumeric(event.keyCode);" onpaste="return false;" Width="50">/asp:TextBox>
* 單價(jià)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()" />
另外附加，有關(guān)文本框驗(yàn)證的文章：https://www.jb51.net/article/33586.htm
您可能感興趣的文章:- JavaScript子窗口ModalDialog中操作父窗口對(duì)像
- iframe 父窗口和子窗口相互的調(diào)用方法集錦
- 子窗口、父窗口和Silverlight之間的相互調(diào)用
- js 父窗口控制子窗口的行為-打開，關(guān)閉，重定位，回復(fù)
- 用javascript父窗口控制只彈出一個(gè)子窗口
- 父窗口獲取彈出子窗口文本框的值
