您的位置：首页 > Web前端 > JavaScript

JS对话框　JS模态对话框 showModalDialog用法详解 父窗口：

2014-05-14 15:36 531 查看


JS对话框　JS模态对话框 showModalDialog用法详解

父窗口：

<html>

<head>

<title>无标题页</title>

<script language="javascript" type="text/javascript">

function opendialog1()

{
var someValue=window.showModalDialog("b.html","","dialogWidth=500px;dialogHeight=500px;status=no;

help=no;scrollbars=no");

document.form1.p1t.value=someValue;
     }

    </script>

</head>

<body>

<form name="form1" action="#">

<input type="text" name="p1t">

<input type="button" value="打开对话框" onclick="opendialog1()">

</form>

</body>

</html>

子窗口：

<html>

<head>

<title>无标题页</title>

<script language="javascript" type="text/javascript">

function a()

{
var wname = document.form1.backname.value;

parent.window.returnValue=wname; //父窗口就是上一个页面

window.close();
    }

</script>

</head>

<body>

<form name="form1" action=""> 

<input type="text" value="输入要传的值" name="backname">

<input type="button" value="传值" onclick="return a()">

</form>

</body>

</html>

**************************************************************************************************************************

---- 1. 基本语法 

---- window对象有一个方法称为showModalDialog，我们可以在页面按钮的onclick中写如下代码： 

< BUTTON onclick="window.showModalDialog 

('dialog.htm')" >Search< /BUTTON > 

---- 系统会在新窗口中打开dialog.htm页面，并且等待用户响应，如果用户不响应该页面，那么主页面将得不到光标。 

---- 在dialog.htm中设置window对象的returnValue属性，就可以让主页面得到返回值。例如，在页面的确定按钮的onclick中写： 

window.returnValue = window. 

document.all.iptPeopleID.value 

---- 将输入框iptPeopleID的值赋给window对象的returnValue属性。在主页面中就可以得到这个值： 

var str = showModalDialog("dialog1.htm") 

---- 2. 传递初始化值 

---- 如果要向模态页面中传递初始化值，可以在主页面中用如下语句： 

var cSearchValue=showModalDialog 

('dialog.htm', 'ABC') 

在dialog.htm中使用window.dialogArguments 

属性可以得到'ABC'。例如： 

< SCRIPT FOR=window EVENT=onload LANGUAGE="JScript" > 

if (window.dialogArguments != null) 

window.document.all.iptPeopleID.value = window.dialogArguments; 

< /SCRIPT > 

---- 3. 传递多个数值 

---- 如果要向模态页面中传递多个参数，可以先在主页面中定义一个对象， 

function myDialog() { 

var str1; 

var str2; 

} 

---- 显示模态页面之前初始化该对象，然后调用showModalDialog方法。 

function WelcomeYou(iniStr1,iniStr2) { 

myDialog.str1 = iniStr1; 

myDialog.str2 =iniStr2 ; 

if (showModalDialog("dialog2.htm", myDialog) 

==false) //将对象传入 

...... 

---- 在模态页面中，可以用这样的代码 

window.document.all.iptID.value= 

window.dialogArguments.str1 

来引用数值，或者用这样的代码对之赋值 

window.dialogArguments.str1 = 

window.document.all.iptID.value 

---- 完整例程如下： 

---- 对于只传递一个参数的情况，见：Main1.htm和dialog1.htm。 

---- 对于传递多个参数的情况，见：Main2.htm和dialog2.htm。 

父窗体： 

dim xxx '返回值 

dim yyy '传到子窗体的参数 

var xxx = ShowModalDialog('xxx.asp','yyy','dialogWidth:100px;DialogHeight=290px;status:no') 

子窗体： 

dim yyy '从父窗体传来的参数 

dim xxx '传回父窗体的参数 

yyy = window.dialogArguments 

xxx = window.returnValue  
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签： 
相关文章推荐
新的分享
章节导航