(面试题)html中创建模态窗口的方法有哪些?
一、创建模态和非模态对话框
除了alert(""); confirm(""); prompt("");之外还有
创建模态对话框:
vReturnValue = window.showModalDialog(sURL [, vFreeArgument] [, sOrnaments]);
如:window.showModalDialog("callee.htm")
创建非模态对话框:
vReturnValue = window.showModelessDialog(sURL [, vFreeArgument] [, sOrnaments]);
如:window.showModelessDialog("callee.htm")
二、控制对话框大小和位置
下面的代码将打开一个高200px、宽800px的对话框:
window.showModalDialog('callee.htm','','dialogHeight:200px;dialogWidth:800px');
以下代码,看看关闭居中属性后新窗口的位置:
window.showModalDialog('callee.htm','','dialogHeight:200px;dialogWidth:800px;center:no');
三、改变对话框外观
下面的代码将去除上下文关联提示图标、不显示状态栏、窗口边缘风格为凹陷:
showModelessDialog("callee.htm","","status:0;help:0;edge:sunken");
四、从父页面页面传递数据到子页面
(一)传递值类型数据
在caller.htm页面中输入以下代码:
<INPUT TYPE="button" VALUE="创建模态对话框" onclick="fnOpenModal()">
<br><br>
<INPUT TYPE="button" VALUE="创建非模态对话框" onclick="fnOpenModeless()">
<script language="javascript">
<!--
function fnOpenModal()
{
window.showModalDialog("callee.htm","打开了一个新模态窗口")
}
function fnOpenModeless()
{
window.showModelessDialog("callee.htm","打开了一个新非模态窗口")
}
//-->
</script>
在callee.htm页面中输入以下代码:
<SCRIPT LANGUAGE="JavaScript">
<!--
alert(dialogArguments);
//-->
</SCRIPT>
(二)传递数组引用类型数据 (同样可以为对象传值)
第一种值类型数据的传递中,在callee.htm页面中只能读取caller.htm页面的传递数据。
当需要对caller.htm页面的传递内容进行修改时,就需使用到数组引用类型的传递方式。
首先,在caller.htm页面中输入以下代码:
<INPUT TYPE="button" VALUE="创建模态对话框" onclick="fnOpenModal()">
<br><br>
<INPUT TYPE="button" VALUE="创建非模态对话框" onclick="fnOpenModeless()">
<script language="javascript">
<!--
var a = new Array;
a[0]="first";
a[1]="second";
a[2]="third";
function fnOpenModal()
{
window.showModalDialog("callee.htm",a)
}
function fnOpenModeless()
{
window.showModelessDialog("callee.htm",a)
}
// -->
</script>
然后在callee.htm页面中输入以下代码:
<SCRIPT LANGUAGE="JavaScript">
<!--
a = dialogArguments; //特殊关键字,表示接收的的参数对象
alert(a);
a[0] = "fourth";
// -->
</SCRIPT>
(面试题)html中创建模态窗口的方法有哪些?的更多相关文章
- 使用jQuery创建模态窗口登陆效果
日期:2013-8-22 来源:GBin1.com 隐藏模态窗口技术是一种很好的解决方案,用于处理不是特有必要出现在网页上的界面元素.社交网络可以使用模态窗口传达私人讯息以及只针对会员才能看 到的表 ...
- [Win32]创建模态窗口
http://www.cnblogs.com/zplutor/archive/2011/02/20/1958973.html 在Win32编程中,如果要显示一个模态窗口,一般是先创建对话框模板,然后使 ...
- IE 中创建 子窗口 传值 与接收值 【window.showModalDialog】
父窗口 创建一个窗口 var backinfo = window.showModalDialog('UserSelect.aspx', '', 'dialogHeight=600px; dialogW ...
- Javascript 中创建自定义对象的方法(设计模式)
Javascript 中创建对象,可以有很多种方法. Object构造函数/对象字面量: 抛开设计模式不谈,使用最基本的方法,就是先调用Object构造函数创建一个对象,然后给对象添加属性. var ...
- Oracle中创建自增字段方法
oracle没有ORACLE自增字段这样的功能,但是通过触发器(trigger)和序列(sequence)可以实现. 下面给大家讲个例子: 1.在Oracle中创建一个表: .创建一个表 ) prim ...
- 极其简单的用JS在浏览器中创建下载文件的方法
有这样一个需求,在js中动态创建一个页面,然后下载该页面为word文档,研究了一上午,最后发现实现起来如此简单. 在js中创建如下方法:(直接复制即可) function downloadFile(f ...
- JavaScript中创建自定义对象的方法
本文内容参考JavaScript高级程序设计(第3版)第6章:面向对象的程序设计 ECMA-262中把对象定义为:“无序属性的集合,其属性可以包含基本值.对象或者函数.”我所理解的就是对象就是一个结构 ...
- Floodlight 中创建消息对象的方法
在 floodlight 中创建各种openflow message 和 action 等採用的是简单工厂方式.BasicFactory类(实现OFMessageFactory接口.) ...
- java4中创建内对象的方法
在java程序中,对象可以被显式地或者隐式地创建.四种显式的创建对象的方式: ● 用new语句创建对象 ● 运用反射手段,调用java.lang.Class 或者 java.lang. ...
随机推荐
- 关于操作系统:eos、deepin
朋友星神推荐了这两个操作系统:eos.deepin,大致看了一下介绍,貌似看起来很棒,界面清新,而且开源,支持的应用也不少,后续我准备尝试一下.此处Mark一下: 官网分别为: https://ele ...
- 微软BI 之SSAS 系列 - 多维数据集中度量值设计时的聚合函数 (累加性_半累加性和非累加性)
在 SSAS 系列 - 实现第一个 Cube 以及角色扮演维度,度量值格式化和计算成员的创建 中主要是通过已存在的维度和事实数据创建了一个多维数据集,并同时解释了 Role-Playing Dimen ...
- ngx_lua实现页面跳转
好久不用ngx_lua了,忽然被问到如何实现页面跳转,半天没反应过来,查了半天资料搞出来的,在这里做一个备份. 需求说明:***.taobao.com 跳转到 www.taobao.com/?url= ...
- XWindow、Server、Client和QT、GTK之间的关系
X WINDOW X Window从逻辑上分为三层:X Server.X Client和X协议.最底层的X Server(X服务器)主要处理输入/输出信息并维护相关资源,它接受来自键盘.鼠标的操作并将 ...
- MongoDB副本集配置系列五:副本集的在线迁移
MongoDB副本集的在线迁移 查看当前集群的状态: { "setName" : "gechongrepl", "setVersion" : ...
- Flash: Event.PASTE Flash获取剪贴板内容 触发paste事件 how to get paste event
actionscript把文字存放到剪贴板这个就非常简单了,一般网站做点击复制基本都是这么做的. 但是,基本没有人做flash粘贴内容.今天本来想尝试一下,通过flash实现网页编辑器粘贴图片,但貌似 ...
- 【DB2】监控动态SQL语句
一.db2监控动态SQL(快照监控) db2示例用户登陆后,使用脚本语句db2 get snapshot for all on dbname>snap.out 也可以使用db2 get snap ...
- scala 几个函数小例子
后续补充 /** * Created by dengy on 2017/12/18. */ object grammarPractise { def main(args: Array[String]) ...
- Inno Setup入门(二)——修改安装过程中的图片
修改安装过程中的图片 一般编译之后,安装过程中出现在左边图片是是下图这个样子的: 其实也可以修改它,只需要在setup段中作一点稍微的修改,加一行代码即可: [setup] AppName=Test ...
- rpm基本命令参考
水可载舟,亦可覆舟! 1. 介绍 在Linux操作系统中,常用的软件有RPM包软件包,src.rpm格式的软件包(源码),以源代码发布的软件包以及.bin格式软件包和绿色软件.如果采用.rpm格式的软 ...