javascript 子窗体父窗体相互传值方法

我们精简使用版本，一般情况好多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)来执行赋值操作.

赞 (0)

相关推荐

  • JS父页面与子页面相互传值方法

    一.子页面是父页面通过window.open弹出的情况子页面要向父页面传值,只要在document前面加window.opener即可. 如: 1.父页面代码: <html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><titl

  • js传值后台中文出现乱码的解决方法

    本文实例讲述了js传值后台中文出现乱码的解决方法.分享给大家供大家参考,具体如下: 在"test.jsp"页面中,需要通过js将值传递到后台,后台根据传递的值进行数据查询时,通过test.jsp的js进行编码(标注部分的代码),后台Java解码(注释标注部分为解码),可以解决 test.jsp: <script type="text/JavaScript" charset="UTF-8"> function test() { //下面

  • JAVASCRIPT实现的WEB页面跳转以及页面间传值方法

    但有时候,需要当某事件触发时,我们先做一些操作,然后再跳转,这时,就要用JAVASCRIPT来实现这一跳转功能. 下面是具体的做法: 一:跳转到新页面,并且是在新窗口中打开时: 复制代码 代码如下: function gogogo() { //do someghing here... window.open("test2.html"); } window是一个javascript对象,可以用它的open方法,需要注意的是,如果这个页面不是一相相对路径,那么要加http://,比如: 复

  • JS传值出现中文参数乱码的解决方法

    本文实例讲述了JS传值出现中文参数乱码的解决方法.分享给大家供大家参考,具体如下: function PopupFK(cNum,type){ var url = "contract!Paying.action"; url = url + "?contract.contractNum="+cNum+"&payingType="+type; // if(isEmpty($(_this).attr("payId"))){ /

  • javascript不同页面传值的改进版

    javascript不同页面传值的改进版

    其实原理也很简单.同样先通过getAttribute判断type属性,捕捉到按钮.然后在按钮onclick时把i通过url传入子页面. 复制代码 代码如下: <h2>input1</h2> <input type="text" /><input type="submit" /> <h2>input2</h2> <input type="text" /><in

  • JS解决url传值出现中文乱码的另类办法

    在开发web应用时,很多情况都需要进行前后台的数据交互,有时候我们可能需要把前台的中文数据通过URL的方式传递到后台,但此时有个令人头疼的问题,因为Java中网络传输使用的标准字符集是ISO-8859-1,所以在后台用request.getParameter("message");获取前台传过来的中文时,得到的还是ISO-8859-1字符集,中文就会出现乱码现象,好多人的解决办法是在前台传递中文之前进行decode,后台再decode一下进行转换,这样感觉很是麻烦,难道就没其他的方式解

  • js url传值中文乱码之解决之道

    在websphere 中使用的是url=encodeURI(encodeURI(url)); //用了2次encodeURI 测试成功,第一次转换没有尝试, 处理方法一. js 程序代码:url=encodeURI(url);注意是整个URL 服务器端的代码:String linename = new String(request.getParameter("name").getBytes("ISO-8859-1"),"UTF-8"); 处理方法

  • js通过地址栏给action传值(中文乱码全是问号)

    前几天在完成一个ssh框架的项目时遇到一个小问题,情况是这样的. 在action中定义了私有变量,并提供get(),set()方法,js代码中就应该可以访问它.于是我从js代码中通过地址栏传值给了action的相应变量,但是,如果变量值为中文的时候,在action中测试输出则为"???",而浏览器地址栏中仍然能显示中文. 我先根据网上一些解答配置了tomcat的配置文件,未果.后来想想也许不是什么复杂的问题,应该就是编码问题.我的myeclipse和项目的编码都设置为的"UT

  • JS获取子、父、兄节点方法小结

    我们在实际的开发中,经常要获取页面中某个html元素,动态更新元素的样式.内容属性等. 我们已经知道在JavaScript中提供下面的方法获取子.父.兄节点的方法: 常规 通过父节点获取子节点: parentObj.firstChild                                           获取已知父节点的第一个子节点 parentObj.lastChild                                           获取已知父节点的最后一个

  • javascript 子窗体父窗体相互传值方法

    我们精简使用版本,一般情况好多cms都有一些这样的函数.dedecms中的选择相关文章也是用的这样的函数.下面给出具体的代码.父页面核心代码: 复制代码 代码如下: <script>function SelectArcListA(fname){ var posLeft = 10; var posTop = 10; window.open("content_select_list.asp?f="+fname+"&k="+form1.keyword.

  • javascript下查找父节点的简单方法

    <div>        <a href="#">标题</a>        <ul id="demo">            <li><a href="#" onclick="selectThisItem(this)">项目一</a></li>                <ul>                 

  • 快速了解Vue父子组件传值以及父调子方法、子调父方法

    稍微总结了一下Vue中父子间传值以及相互调方法的问题,非常基础.希望可以帮到你!先来个最常用的,直接上代码: 1.父传值给子组件 父组件: <template> <div> <p class="father">父组件</p> <child :sid="id"></child> </div> </template> <script> import child f

  • Vue2.0中三种常用传值方式(父传子、子传父、非父子组件传值)

    Vue2.0 传值方式: 在Vue的框架开发的项目过程中,经常会用到组件来管理不同的功能,有一些公共的组件会被提取出来.这时必然会产生一些疑问和需求?比如一个组件调用另一个组件作为自己的子组件,那么我们如何进行给子组件进行传值呢?如果是电商网站系统的开发,还会涉及到购物车的选项,这时候就会涉及到非父子组件传值的情况.当然你也可以用Vuex状态管理工具来实现,这部分我们后续会单独介绍.我先给大家介绍Vue开发中常用的三种传值方式. Vue常用的三种传值方式有: •父传子 •子传父 •非父子传值 引

  • C#简单实现子窗体向父窗体传值的方法

    本文实例讲述了C#简单实现子窗体向父窗体传值的方法.分享给大家供大家参考.具体如下: 击Form1的button1 打开Form2 再点击Form2的button2 在button2_Click事件中 通过this.Owner将Form2的textBox2的值设置给Form1的textBox1 并关闭Form2 public partial class Form1 : Form { public Form1() { InitializeComponent(); } private void bu

  • jQuery实现iframe父窗体和子窗体的相互调用

    本文实例讲述了jQuery实现iframe父窗体和子窗体的相互调用方法.分享给大家供大家参考,具体如下: 父窗体 <html> <head> <title>usually function</title> </head> <body> <iframe src="http://www.baidu.com" ></iframe> <iframe src="myifame.html

  • JavaScript 弹出子窗体并返回结果到父窗体的实现代码

    思路:用window.showModalDialog方法获取到弹出子窗体的引用,再在子页面用window.returnValue="***"来返回结果. 示例代码:(用jQuery简化实现) 父页面:parent.html <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional

  • jQuery子窗体取得父窗体元素的方法

    本文实例讲述了jQuery子窗体取得父窗体元素的方法.分享给大家供大家参考.具体如下: $("#父窗口元素ID",window.parent.document); 对应javascript版本为 window.parent.document.getElementById("父窗口元素ID"); 取父窗口的元素方法: $(selector, window.parent.document); 取父窗口的父窗口的元素就可以用: $(selector, window.par

随机推荐