首頁 > 開發者 > JavaScript

javascript 子表單父表單相互傳值方法

來源：互聯網
上載者：User
創建阿里雲帳戶，並獲得超過 40 款產品的免費試用版；而企業帳戶則可以享有總值 $1200 的免費試用版。立即註冊！

指令碼之家精簡使用版本，一般情況好多cms都有一些這樣的函數。dedecms中的選擇相關文章也是用的這樣的函數。下面給出具體的代碼。
父頁面核心代碼: 複製代碼 代碼如下:<script>
function SelectArcListA(fname){
var posLeft = 10;
var posTop = 10;
window.open("content_select_list.asp?f="+fname+"&k="+form1.keyword.value, "selArcList", "scrollbars=yes,resizable=yes,statebar=no,width=700,height=500,left="+posLeft+", top="+posTop);
}
</script>
<input name="lsel" type="button" id="lsel" class="nbt" style="width:150px" onChange="" value="從發行文檔中選取..." onClick="SelectArcListA('form1.xiangguanid');">

子頁面的核心代碼:複製代碼 代碼如下:<SCRIPT language=javascript>
//獲得選中檔案的檔案名稱
function getCheckboxItem()
{
var allSel="";
if(document.form2.arcID.value) return document.form2.arcID.value;
for(i=0;i<document.form2.arcID.length;i++)
{
if(document.form2.arcID[i].checked)
{
if(allSel=="")
allSel = document.form2.arcID[i].value;
else
allSel = allSel+","+document.form2.arcID[i].value;
}
}
return allSel;
}
function selAll()
{
for(i=0;i<document.form2.arcID.length;i++)
{
if(!document.form2.arcID[i].checked)
{
document.form2.arcID[i].checked=true;
}
}
}
function noSelAll()
{
for(i=0;i<document.form2.arcID.length;i++)
{
if(document.form2.arcID[i].checked)
{
document.form2.arcID[i].checked=false;
}
}
}
function ReturnValue()
{
if(window.opener.document.form1.xiangguanid.value==""){
window.opener.document.form1.xiangguanid.value = getCheckboxItem();
}
else{
window.opener.document.form1.xiangguanid.value += ","+getCheckboxItem();
}
alert("成功增加你選中的ID，你可以繼續增加");
//window.opener=true;
//window.close();
}

下面是html代碼，頁面中需要<input type="checkbox" name="arcID" value="<%=rs("id")%>">輸出選擇的id複製代碼 代碼如下:<A class=inputbutx
href="javascript:selAll()">全選</A> <A class=inputbutx
href="javascript:noSelAll()">取消</A> <A class=inputbutx
href="javascript:ReturnValue()">把選定值加到列表</A>

一下是補充：
//模式表單傳值

<!-- ====== 父表單，我取名為parentform.html ==== --> 複製代碼 代碼如下:<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<title>快顯視窗內錄入資料確定後返回給父表單--主表單</title>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="jb 51.net">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">

<script language="javascript" type="text/javascript">
function doInput()
{
var win = window.showModalDialog("Childform.html",window,"dialogWidth=500px;dialogHeight=300px;center=yes;status=no");
if(win != null)
{
document.getElementById("parentTextBox").value = win;
}
}
</script>

</head>
<body>在新彈出的表單裡輸入資料，傳輸到父表單.
<br/>
<br/>
<br/>
<input type="text" id="parentTextBox" /> <a href="javascript:doInput()">點這裡彈出子表單</a>
</BODY>
</HTML>

<!-- =============　父表單代碼結束　============= -->

<!-- =======　子表單：取名為childform.html 　======= --> 複製代碼 代碼如下:<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<title> 快顯視窗內錄入資料確定後返回給父表單--子表單</title>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="qiujy">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
<base target="_self">
</head>
<body topmargin="0" leftmargin="0" scroll="no">
</br>
<input type="text" id="childTextBox"/>
</br></br>
<a href="javascript:doPassToParent()">點這裡返回</a>
</BODY>
</HTML>
<script language="javascript" type="text/javascript">
document.getElementById("childTextBox").value = window.dialogArguments.document.getElementById("parentTextBox").value;
function doPassToParent()
{
if(document.getElementById("childTextBox").value.length <=0)
{
alert("請填寫資料");
return;
}
window.returnValue = document.getElementById("childTextBox").value;
window.close();

}
</script>

//子表單和父表單傳值

1.建立兩個頁面 一個是 Parent.html 複製代碼 代碼如下:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>父表單</title>
<script language="javascript" type="text/javascript">
function OpenWindow(){
window.open('son.html');
}
function setValue(m_strValue){
document.getElementById("txt_Value").value = m_strValue;
}
</script>
</head>

<body>
<form id="form1" name="form1" method="post" action="">
<label>
<input type="text" name="txt_Value" id="txt_Value" />
</label>
<label>
<input type="button" name="btn_ShowClose" id="btn_ShowClose" value="按鈕" onclick="OpenWindow();" />
</label>
</form>
</body>
</html>

另一個是子表單 : 複製代碼 代碼如下:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>子表單</title>
<script language="javascript" type="text/javascript" >
function CloseWind(){
opener.setValue("傳值到父表單");
window.close();
}
</script>
</head>

<body>
<form id="form1" name="form1" method="post" action="">
<label>關閉
<input type="button" name="btn_Close" id="btn_Close" value="按鈕" onclick="CloseWind();"

/>
</label>
</form>
</body>
</html>

2.通過子表單執行的父表單的setValue(m_strValue)來執行賦值操作.

本文章原先以中文撰寫並發佈於 aliyun.com，亦設英文版本，僅作資訊用途。本網站不對文章的準確性，完整性或可靠性或其任何翻譯作出任何明示或暗示的陳述或保證。如對該文章有任何疑慮或投訴，請傳送電郵至 info-contact@alibabacloud.com 並提供相關疑慮或投訴的詳細說明。職員會於 5 個工作天內與您聯絡，一經驗證之後，即會刪除該侵權內容。

相關關鍵詞：
formatmoney javascript javascript getdatetime unlink javascript hmac javascript javascript echo javascript encode javascript encodeuri
相關文章
漂亮簡單Javascript 調色盤代碼
javascript的indexOf忽略大小寫方法_javascript技巧
JavaScript的parseInt 取整使用
用js一招破解所有網頁的加密原始碼的方法
Wireshark基本介紹和學習TCP三向交握，wiresharktcp
jQuery AJAX timeout 逾時問題詳解，jqueryajax

聯繫我們

該頁面正文內容均來源於網絡整理，並不代表阿里雲官方的觀點，該頁面所提到的產品和服務也與阿里云無關，如果該頁面內容對您造成了困擾，歡迎寫郵件給我們，收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容，歡迎發送郵件至： info-contact@alibabacloud.com 進行舉報並提供相關證據，工作人員會在 5 個工作天內聯絡您，一經查實，本站將立刻刪除涉嫌侵權內容。

熱門內容

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

Get Started for Free

  • Sales Support

    1 on 1 presale consultation

    Chat Contact Sales

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

    Open a Ticket

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.

    Learn More