真正的模式对话框-js

最新推荐文章于 2024-09-22 11:17:00 发布

泪影

最新推荐文章于 2024-09-22 11:17:00 发布

阅读量3.6k

点赞数

分类专栏： asp.net js html 文章标签： javascript button function input html 文档

asp.net 同时被 3 个专栏收录

38 篇文章 0 订阅

订阅专栏

html

10 篇文章 0 订阅

订阅专栏

9 篇文章 0 订阅

订阅专栏

<html>
<head>
    <title>
        真正的模式对话框
   </title>
   <script language="javascript" type="text/javascript">
   /*用来显示模式对话框的方法*/
   function show()
   {
   /*var mValue接收对话框回传的值*/
    var mValue=showModalDialog("m.html","向对话框传参","dialogWidth:200px;dialogHeight:200px;status:0;help:0");
   /*以上的参数，第一个是嵌入模式对话框的网页，第二个用来向对话框传递参数。传递的参数类型不限，包括数组等。对话框通过window.dialogArguments来取得传递进来的参数，第三个是属性宽、高、状态栏、帮助按钮等可以自己尝试一下0为没有*/
    if(mValue=="")
    {//如果回传的是空字符串
     document.getElementById("label").innerText="传回的值为空！";
    }else
    {//否则在label中显示
     document.getElementById("label").innerText=mValue;
    }
   }
   </script>
</head>
<body>
   点击按钮<button onClick="show()">弹出对话框</button>
   <label id="label" style="color:green; font-size:14px">这里显示回传值</label>
</body>
</html>

<html>
<head>
   <title>
    模式对话框，有返回值
   </title>
   <script language="javascript" type="text/javascript">
    function closeM()
    {
    window.returnValue=text.value;//设置返回值
    window.close();//关闭窗口
    }
   </script>
</head>

<body onUnload="closeM()">
   <p>这是一个html网页，嵌套在模式对话框中去显示！</p>
   回传一个值<input id="text" type="text" />
   <button onClick="closeM()">关闭显示</button>
</body>
</html>

<!--

   参数说明：
   sURL--
   必选参数，类型：字符串。用来指定对话框要显示的文档的URL。
   vArguments--
   可选参数，类型：变体。用来向对话框传递参数。传递的参数类型不限，包括数组等。对话框通过window.dialogArguments来取得传递进来的参数。
   sFeatures--
   可选参数，类型：字符串。用来描述对话框的外观等信息，可以使用以下的一个或几个，用分号“;”隔开。
   1.dialogHeight    :对话框高度，不小于１００px，ＩＥ４中dialogHeight    和    dialogWidth    默认的单位是em，而ＩＥ５中是px，为方便其见，在定义modal方式的对话框时，用px做单位。
   2.dialogWidth:    对话框宽度。
   3.dialogLeft:    离屏幕左的距离。
   4.dialogTop:    离屏幕上的距离。
   5.center:    {yes    |    no    |    1    |    0    }：窗口是否居中，默认yes，但仍可以指定高度和宽度。
   6.help:    {yes    |    no    |    1    |    0    }：是否显示帮助按钮，默认yes。
   7.resizable:    {yes    |    no    |    1    |    0    }    ［ＩＥ５＋］：是否可被改变大小。默认no。
   8.status:    {yes    |    no    |    1    |    0    }    ［IE5+］：是否显示状态栏。默认为yes[    Modeless]或no[Modal]。
   9.scroll:{    yes    |    no    |    1    |    0    |    on    |    off    }：指明对话框是否显示滚动条。默认为yes。
   下面几个属性是用在HTA中的，在一般的网页中一般不使用。
   10.dialogHide:{    yes    |    no    |    1    |    0    |    on    |    off    }：在打印或者打印预览时对话框是否隐藏。默认为no。
   11.edge:{    sunken    |    raised    }：指明对话框的边框样式。默认为raised。
   12.unadorned:{    yes    |    no    |    1    |    0    |    on    |    off    }：默认为no。