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

Javascript
JavaScript DOM学习第八章 表单错误提示
JavaScript DOM 学习第九章 选取范围的介绍
JavaScript CSS修改学习第一章 查找位置
JavaScript CSS修改学习第二章 样式
JavaScript CSS修改学习第三章 修改样式表
JavaScript CSS 修改学习第四章 透明度设置
JavaScript CSS修改学习第五章 给“上传”添加样式
JavaScript CSS修改学习第六章 拖拽
Jquery乱码的一次解决过程 图解教程
javascript 包裹节点 提高效率
javascript inneHTML的地雷
javascript 定义新对象方法
判定对象是否为window的js代码
jquery validator 插件增加日期比较方法
jquery 得到当前页面高度和宽度的两个函数
JavaScript 编写匿名函数的几种方法
jQuery 操作下拉列表框实现代码
jQuery入门问答 整理的几个常见的初学者问题
第一个JavaScript入门基础 document.write输出
javascript入门基础之私有变量

No. « 288 289 290 291 »

技术文章搜索

关键字

Javascript showModalDialog两个窗体之间传值

出处:互联网   整理: 软晨网（RuanChen.com）   发布: 2009-10-10   浏览: 142 ::
收藏到网摘: 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>