当前位置: 首页 > 图文教程 > 网络编程 > Javascript > Javascript showModalDialog两个窗体之间传值

Javascript
javaScript 数值型和字符串型之间的转换
从父页面读取和操作iframe中内容方法
IE DOM实现存在的部分问题及解决方法
jqPlot Option配置对象详解
jquery JSON的解析方式
JavaScript 捕获窗口关闭事件
xml 封装与解析(javascript和C#中)
JavaScript 设计模式学习 Singleton
JavaScript 设计模式学习 Factory
javascript CSS画图之基础篇
JavaScript 获取事件对象的注意点
JavaScript Konami Code 实现代码
Google Map API更新实现用户自定义标注坐标
JavaScript this 深入理解
javascript EXCEL 操作类代码
window.parent调用父框架时 ie跟火狐不兼容问题
关于取不到由location.href提交而来的上级页面地址的解决办法
JS input 数字验证代码
网页全屏显示代码说明分析
JS 学习笔记 防止发生命名冲突

No. « 149 150 151 152 »

技术文章搜索

关键字

Javascript showModalDialog两个窗体之间传值

出处:互联网   整理: 软晨网（RuanChen.com）   发布: 2009-10-10   浏览: 300 ::
收藏到网摘: n/a

前一篇文章Javascript怎么在两个窗体之间传值中讲到了如何利用window.open()方法打开新窗体，并在两个窗体之间传值的方法。 Javascript 两个窗体之间传值实现代码
javascript中还有一个函数window.showModalDialog也可以打开一个新窗体，不过他打开的是一个模态窗口，那么如何在父窗体和子窗体之间传值呢？我们先看该函数的定义：vReturnValue = window.showModalDialog(sURL [, vArguments] [,sFeatures])
参数说明：
sURL--必选参数，类型：字符串。用来指定对话框要显示的文档的URL。
vArguments--可选参数，类型：变体。用来向对话框传递参数。传递的参数类型不限，包括数组等。对话框通过window.dialogArguments来取得传递进来的参数。
sFeatures--可选参数，类型：字符串。用来描述对话框的外观等信息，可以使用以下的一个或几个，用分号“;”隔开。
dialogHeight :对话框高度，不小于１００px，ＩＥ４中dialogHeight 和 dialogWidth 默认的单位是em，而ＩＥ５中是px，为方便其见，在定义modal方式的对话框时，用px做单位。
dialogWidth: 对话框宽度。
dialogLeft: 离屏幕左的距离。
dialogTop: 离屏幕上的距离。
center: {yes | no | 1 | 0 }：窗口是否居中，默认yes，但仍可以指定高度和宽度。
help: {yes | no | 1 | 0 }：是否显示帮助按钮，默认yes。
resizable: {yes | no | 1 | 0 } [IE5+]:是否可被改变大小。默认no。
status: {yes | no | 1 | 0 } [IE5+]:是否显示状态栏。默认为yes[ Modeless]或no[Modal]。
scroll:{ yes | no | 1 | 0 | on | off }：指明对话框是否显示滚动条。默认为yes。
如："dialogWidth=200px;dialogHeight=100px"
因此我们可以通过window.dialogArguments参数来在两个窗体之间传值
如下面两个页面：FatherPage.htm:
复制代码 代码如下:

<script type="text/javascript">
function OpenChildWindow()
{
window.showModalDialog('ChildPage.htm',document.getElementById('txtInput').value);
}
</script>
<input type="text" id="txtInput" />
<input type="button" value="OpenChild" onclick="OpenChildWindow()" />

ChildPage.htm:
复制代码 代码如下:

<body onload="Load()">
<script type="text/javascript">
function Load()
{
document.getElementById('txtInput').value=window.dialogArguments ;
}
</script>
<input type="text" id="txtInput" />
</body>

上面只是传递简单的字符串，我们还可以传递数组，如：FatherPage.htm:
XML-Code:
复制代码 代码如下:

<script type="text/javascript">
function OpenChildWindow()
{
var args = new Array();
args[0] = document.getElementById('txtInput').value;
window.showModalDialog('ChildPage.htm',args);
}
</script>
<input type="text" id="txtInput" />
<input type="button" value="OpenChild" onclick="OpenChildWindow()" />ChildPage.htm:
XML-Code:
<script type="text/javascript">
function Load()
{
document.getElementById('txtInput').value=window.dialogArguments[0] ;
}
</script>

同样我们还可以传递对象，如：FatherPage.htm:
XML-Code:
复制代码 代码如下:

<script type="text/javascript">
function OpenChildWindow()
{
var obj = new Object();
obj.name = document.getElementById('txtInput').value;
window.showModalDialog('ChildPage.htm',obj);
}
</script>
<input type="text" id="txtInput" />
<input type="button" value="OpenChild" onclick="OpenChildWindow()" />

ChildPage.html:
XML-Code:
复制代码 代码如下:

<script type="text/javascript">
function Load()
{
var obj = window.dialogArguments;
document.getElementById('txtInput').value=obj.name ;
}
</script>

以上都是从父窗体向子窗体传值，那么如何从子窗体向父窗体传值呢 ？其实通过window.returnValue就可以获取子窗体的值，window.returnValue与window.dialogArguments一样，可以是任意变量，包括字符串，数组，对象等。如：FatherPage.html:
XML-Code:
复制代码 代码如下:

<script type="text/javascript">
function OpenChildWindow()
{
var obj = new Object();
obj.name = document.getElementById('txtInput').value;
var result = window.showModalDialog('ChildPage.htm',obj);
document.getElementById('txtInput').value = result.name;
}
</script>
<input type="text" id="txtInput" />
<input type="button" value="OpenChild" onclick="OpenChildWindow()" />

ChildPage.html:
XML-Code:
复制代码 代码如下:

<body onload="Load()">
<script type="text/javascript">
function Load()
{
var obj = window.dialogArguments;
document.getElementById('txtInput').value=obj.name ;
}
function SetValue()
{
var obj = new Object();
obj.name = document.getElementById('txtInput').value;
window.returnValue = obj;
window.close();
}
</script>
<input type="text" id="txtInput" />
<input type="button" value="SetFather" onclick="SetValue()" />
</body>