`
yanxiaohui5522
  • 浏览: 59163 次
  • 来自: ...
社区版块
存档分类
最新评论

showModalDialog()、showModelessDialog()方法使用详解

阅读更多


Javascript有许多内建的方法来产生对话框,如:window.alert(), window.confirm(),window.prompt().等。 然而IE提供更多的方法支持对话框。如:

  showModalDialog() (IE 4+ 支持)
  showModelessDialog() (IE 5+ 支持)


window.showModalDialog()方法用来创建一个显示HTML内容的模态对话框,由于是对话框,因此它并没有一般用window.open()打开的窗口的所有属性。
window.showModelessDialog()方法用来创建一个显示HTML内容的非模态对话框。

当我们用showModelessDialog()打开窗口时,不必用window.close()去关闭它,当以非模态方式[IE5]打开时, 打开对话框的窗口仍可以进行其他的操作,即对话框不总是最上面的焦点,当打开它的窗口URL改变时,它自动关闭。而模态[IE4]方式的对话框始终有焦点(焦点不可移走,直到它关闭)。模态对话框和打开它的窗口相联系,因此我们打开另外的窗口时,他们的链接关系依然保存,并且隐藏在活动窗口的下面。

使用方法如下:
vReturnValue = window.showModalDialog(sURL [, vArguments] [, sFeatures])
vReturnValue = window.showModelessDialog(sURL [, vArguments] [, sFeatures])
参数说明:
sURL
必选参数,类型:字符串。用来指定对话框要显示的文档的URL。
vArguments
可选参数,类型:变体。用来向对话框传递参数。传递的参数类型不限,包括数组等。对话框通过window.dialogArguments来取得传递进来的参数。
sFeatures
可选参数,类型:字符串。用来描述对话框的外观等信息,可以使用以下的一个或几个,用分号“;”隔开。
  dialogHeight 对话框高度,不小于100px,IE4中dialogHeight 和 dialogWidth 默认的单位是em,而IE5中是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。

  还有几个属性是用在HTA中的,在一般的网页中一般不使用。
  dialogHide:{ yes | no | 1 | 0 | on | off }:在打印或者打印预览时对话框是否隐藏。默认为no。
  edge:{ sunken | raised }:指明对话框的边框样式。默认为raised。
  unadorned:{ yes | no | 1 | 0 | on | off }:默认为no。

传入参数:
要想对话框传递参数,是通过vArguments来进行传递的。类型不限制,对于字符串类型,最大为4096个字符。也可以传递对象,例如:

test1.htm
====================
<script>
  var mxh1 = new Array("mxh","net_lover","孟子E章")
  var mxh2 = window.open("about:blank","window_mxh")
  // 向对话框传递数组
  window.showModalDialog("test2.htm",mxh1)
  // 向对话框传递window对象
  window.showModalDialog("test3.htm",mxh2)
</script>

test2.htm
====================
<script>
  var a = window.dialogArguments
  alert("您传递的参数为:" + a)
</script>

test3.htm
====================
<script>
  var a = window.dialogArguments
  alert("您传递的参数为window对象,名称:" + a.name)
</script>

可以通过window.returnValue向打开对话框的窗口返回信息,当然也可以是对象。例如:

test4.htm
===================
<script>
  var a = window.showModalDialog("test5.htm")
  for(i=0;i<a.length;i++) alert(a[i])
</script>

test5.htm
===================
<script>
function sendTo()
{
  var a=new Array("a","b")
  window.returnValue = a
  window.close()

}





一、showModalDialog和showModelessDialog有什么不同?
  showModalDialog:被打开后就会始终保持输入焦点。除非对话框被关闭,否则用户无法切换到主窗口。类似alert的运行效果。
  showModelessDialog:被打开后,用户可以随机切换输入焦点。对主窗口没有任何影响(最多是被挡住一下而以。:P)

二、怎样才让在showModalDialog和showModelessDialog的超连接不弹出新窗口?
  在被打开的网页里加上<base target="_self">就可以了。这句话一般是放在<html>和<body>之间的。

三、怎样才刷新showModalDialog和showModelessDialog里的内容?
  在showModalDialog和showModelessDialog里是不能按F5刷新的,又不能弹出菜单。这个只能依靠javascript了,以下是相关代码:

<body (event.keyCode==116){reload.click()}">
<a href="filename.htm" style="display:none">reload...</a>

  将filename.htm替换成网页的名字然后将它放到你打开的网页里,按F5就可以刷新了,注意,这个要配合<base target="_self">使用,不然你按下F5会弹出新窗口的。

四、如何用javascript关掉showModalDialog(或showModelessDialog)打开的窗口。
  <input type="button" value="关闭" >
  也要配合<base target="_self">,不然会打开一个新的IE窗口,然后再关掉的。

五、showModalDialog和showModelessDialog数据传递技巧。
   
  例子:
    现在需要在一个showModalDialog(或showModelessDialog)里读取或设置一个变量var_name

      一般的传递方式:
        window.showModalDialog("filename.htm",var_name)
        //传递var_name变量
      在showModalDialog(或showModelessDialog)读取和设置时:
        alert(window.dialogArguments)//读取var_name变量
        window.dialogArguments="oyiboy"//设置var_name变量
    这种方式是可以满足的,但是当你想在操作var_name同时再操作第二个变理var_id时呢?就无法再进行操作了。这就是这种传递方式的局限性。
    
      以下是我建议使用的传递方式:
        window.showModalDialog("filename.htm",window)
        //不管要操作什么变量,只直传递主窗口的window对象
      在showModalDialog(或showModelessDialog)读取和设置时:
        alert(window.dialogArguments.var_name)//读取var_name变量
        window.dialogArguments.var_name="oyiboy"//设置var_name变量

        同时我也可以操作var_id变量
        alert(window.dialogArguments.var_id)//读取var_id变量
        window.dialogArguments.var_id="001"//设置var_id变量

        同样还可以对主窗口的任何对象进行操作,如form对象里的元素。
        window.dialogArguments.form1.index1.value="这是在设置index1元素的值"

六、多个showModelessDialog的相互操作。
  以下代码的主要作用是在一个showModelessDialog里移动别一个showModelessDialog的位置。

  主文件的部份js代码。
  var s1=showModelessDialog('控制.htm',window,"dialogTop:1px;dialogLeft:1px") //打开控制窗口
  var s2=showModelessDialog('about:blank',window,"dialogTop:200px;dialogLeft:300px")  //打开被控制窗口

  控制.htm的部份代码。
  <script>
    //操作位置数据,因为窗口的位置数据是"xxxpx"方式的,所以需要这样的一个特殊操作函数。
function countNumber(A_strNumber,A_strWhatdo)
{
  A_strNumber=A_strNumber.replace('px','')
  A_strNumber-=0
  switch(A_strWhatdo)
  {
  case "-":A_strNumber-=10;break;
  case "+":A_strNumber+=10;break;
  }
  return A_strNumber + "px"
}
  </script>
  <input type="button" -')" value="上移">
  <input type="button" -')" value="左移">
  <input type="button" +')" value="右移">
  <input type="button" +')" value="下移">

  以上关键部份是:
    窗口命名方式:var s1=showModelessDialog('控制.htm',window,"dialogTop:1px;dialogLeft:1px")
    变量访问方式:window.dialogArguments.s2.dialogTop

分享到:
评论

相关推荐

    数据库基础测验20241113.doc

    数据库基础测验20241113.doc

    微信小程序下拉选择组件

    微信小程序下拉选择组件

    DICOM文件+DX放射平片-数字X射线图像DICOM测试文件

    DICOM文件+DX放射平片—数字X射线图像DICOM测试文件,文件为.dcm类型DICOM图像文件文件,仅供需要了解DICOM或相关DICOM开发的技术人员当作测试数据或研究使用,请勿用于非法用途。

    Jupyter Notebook《基于双流 Faster R-CNN 网络的 图像篡改检测》+项目源码+文档说明+代码注释

    <项目介绍> - 基于双流 Faster R-CNN 网络的 图像篡改检测 - 不懂运行,下载完可以私聊问,可远程教学 1、该资源内项目代码都经过测试运行成功,功能ok的情况下才上传的,请放心下载使用! 2、本项目适合计算机相关专业(如计科、人工智能、通信工程、自动化、电子信息等)的在校学生、老师或者企业员工下载学习,也适合小白学习进阶,当然也可作为毕设项目、课程设计、作业、项目初期立项演示等。 3、如果基础还行,也可在此代码基础上进行修改,以实现其他功能,也可用于毕设、课设、作业等。 下载后请首先打开README.md文件(如有),仅供学习参考, 切勿用于商业用途。 --------

    使用epf捕获没有CA证书的SSLTLS明文(LinuxAndroid内核支持amd64arm64).zip

    c语言

    (源码)基于Arduino的天文数据库管理系统.zip

    # 基于Arduino的天文数据库管理系统 ## 项目简介 本项目是一个基于Arduino的天文数据库管理系统,旨在为Arduino设备提供一个完整的天文数据库,包括星星、星系、星团等天体数据。项目支持多种语言的星座名称,并提供了详细的天体信息,如赤道坐标、视星等。 ## 项目的主要特性和功能 星座目录包含88个星座,提供拉丁语、英语和法语的缩写和全名。 恒星目录包含494颗亮度达到4等的恒星。 梅西耶目录包含110个梅西耶天体。 NGC目录包含3993个NGC天体,亮度达到14等。 IC目录包含401个IC天体,亮度达到14等。 天体信息每个天体(不包括星座)提供名称、命名、相关星座、赤道坐标(J2000)和视星等信息。 恒星额外信息对于恒星,还提供每年在赤经和赤纬上的漂移以及视差。 ## 安装使用步骤 1. 安装库使用Arduino IDE的库管理器安装本项目的库。 2. 解压数据库将db.zip解压到SD卡中。

    (源码)基于JSP和SQL Server的维修管理系统.zip

    # 基于JSP和SQL Server的维修管理系统 ## 项目简介 本项目是一个基于JSP和SQL Server的维修管理系统,旨在提供一个高效、便捷的维修管理解决方案。系统涵盖了从维修订单的创建、管理到配件的录入、更新等多个功能模块,适用于各类维修服务行业。 ## 项目的主要特性和功能 1. 用户管理 管理员和客户的注册与登录。 管理员信息的管理与更新。 客户信息的创建、查询与更新。 2. 维修订单管理 维修订单的创建、查询与更新。 维修回执单的创建与管理。 3. 配件管理 配件信息的录入与更新。 配件库存的管理与查询。 4. 评价与反馈 客户对维修服务的评价记录。 系统反馈信息的收集与管理。 5. 数据加密与安全 使用MD5加密算法对用户密码进行加密存储。 通过过滤器实现登录验证,确保系统安全。 ## 安装使用步骤

    devecostudio-windows-3.1.0.501.zip

    HUAWEI DevEco Studio,以下简称DevEco Studio)是基于IntelliJ IDEA Community开源版本打造,为运行在HarmonyOS和OpenHarmony系统上的应用和服务(以下简称应用/服务)提供一站式的开发平台。 作为一款开发工具,除了具有基本的代码开发、编译构建及调测等功能外,DevEco Studio还具有如下特点: - 高效智能代码编辑:支持ArkTS、JS、C/C++等语言的代码高亮、代码智能补齐、代码错误检查、代码自动跳转、代码格式化、代码查找等功能,提升代码编写效率。更多详细信息,请参考[编辑器使用技巧] - 低代码可视化开发:丰富的UI界面编辑能力,支持自由拖拽组件和可视化数据绑定,可快速预览效果

    《计算机视觉技术》实验报告-8.1提取车辆轮廓

    《计算机视觉技术》实验报告-8.1提取车辆轮廓

    springboot小徐影城管理系统(代码+数据库+LW)

    随着现在网络的快速发展,网上管理系统也逐渐快速发展起来,网上管理模式很快融入到了许多生活之中,随之就产生了“小徐影城管理系统”,这样就让小徐影城管理系统更加方便简单。 对于本小徐影城管理系统的设计来说,系统开发主要是采用java语言技术,在整个系统的设计中应用MySQL数据库来完成数据存储,具体根据小徐影城管理系统的现状来进行开发的,具体根据现实的需求来实现小徐影城管理系统网络化的管理,各类信息有序地进行存储,进入小徐影城管理系统页面之后,方可开始操作主控界面,主要功能包括管理员:首页、个人中心、用户管理、电影类型管理、放映厅管理、电影信息管理、购票统计管理、系统管理、订单管理,用户前台;首页、电影信息、电影资讯、个人中心、后台管理、在线客服等功能。 本论文主要讲述了小徐影城管理系统开发背景,该系统它主要是对需求分析和功能需求做了介绍,并且对系统做了详细的测试和总结。具体从业务流程、数据库设计和系统结构等多方面的问题。望能利用先进的计算机技术和网络技术来改变目前的小徐影城管理系统状况,提高管理效率。

    C++与Matlab实现SIFT特征提取算法+项目源码+文档说明+代码注释

    <项目介绍> - SIFT特征提取算法C++与Matlab实现 - 不懂运行,下载完可以私聊问,可远程教学 1、该资源内项目代码都经过测试运行成功,功能ok的情况下才上传的,请放心下载使用! 2、本项目适合计算机相关专业(如计科、人工智能、通信工程、自动化、电子信息等)的在校学生、老师或者企业员工下载学习,也适合小白学习进阶,当然也可作为毕设项目、课程设计、作业、项目初期立项演示等。 3、如果基础还行,也可在此代码基础上进行修改,以实现其他功能,也可用于毕设、课设、作业等。 下载后请首先打开README.md文件(如有),仅供学习参考, 切勿用于商业用途。 --------

    (1991-2024年)国家自然、社科基金部分名单(含部分标书)(最新!!!)

    数据介绍 数据名称:国家自然、社科基金部分名单 数据年份:1991-2024年 样本数量:10万+ 数据格式:PDF、excel

    卓晴-信号与系统课件.pdf

    卓晴

    as-bundled-clients

    as-bundled-clients

    学习时最后的资料包括面试等信息

    学习时最后的资料包括面试等信息

    (源码)基于Spring Boot和Ant Design的雨选课系统.zip

    # 基于Spring Boot和Ant Design的雨选课系统 ## 项目简介 雨选课系统是一个基于Spring Boot和Ant Design框架构建的前后端分离的选课系统。该系统实现了学生选课、成绩查询、教师成绩修改、课程编辑、课程新增等功能。登录信息使用Redis存储,并支持课程图片的上传功能。 ## 项目的主要特性和功能 1. 用户登录与权限管理 学生、教师和管理员分别有不同的登录权限。 登录信息使用Redis进行存储。 2. 课程管理 学生可以查看可选课程列表,并进行选课和退选操作。 教师可以查看自己教授的课程,并修改学生成绩。 管理员可以编辑和新增课程。 3. 成绩管理 学生可以查询自己的成绩。 教师可以修改学生的成绩。 4. 图片上传 支持课程图片的上传和展示。 5. 日志记录 系统记录请求和响应的日志信息,便于问题追踪和性能分析。

    数据库期末作业基于Python+mysql的餐厅点餐系统源码+数据库+文档说明(高分项目)

    数据库期末作业基于Python+mysql的餐厅点餐系统源码+数据库+文档说明(高分项目),含有代码注释,满分大作业资源,新手也可看懂,期末大作业、课程设计、高分必看,下载下来,简单部署,就可以使用。该项目可以作为课程设计期末大作业使用,该系统功能完善、界面美观、操作简单、功能齐全、管理便捷,具有很高的实际应用价值。 数据库期末作业基于Python+mysql的餐厅点餐系统源码+数据库+文档说明(高分项目)数据库期末作业基于Python+mysql的餐厅点餐系统源码+数据库+文档说明(高分项目)数据库期末作业基于Python+mysql的餐厅点餐系统源码+数据库+文档说明(高分项目)数据库期末作业基于Python+mysql的餐厅点餐系统源码+数据库+文档说明(高分项目)数据库期末作业基于Python+mysql的餐厅点餐系统源码+数据库+文档说明(高分项目)数据库期末作业基于Python+mysql的餐厅点餐系统源码+数据库+文档说明(高分项目)数据库期末作业基于Python+mysql的餐厅点餐系统源码+数据库+文档说明(高分项目)数据库期末作业基于Python+mysql的餐厅

    江苏镇江两座小桥的技术状况评估与维修建议

    内容概要:本文针对镇江市丹徒区辛丰镇的两座小型桥梁(大叶二组滚水坝桥与东联组桥)进行了详细的技术状况评定和现状调查。主要内容包括:桥梁的基本参数描述、桥梁各部分的具体检查结果以及存在的具体病害及其原因分析,同时依据《公路桥梁技术状况评定标准》对每座桥梁分别给出了综合评分和技术状况等级,并提出了具体的维护与修复建议。大叶二组滚水坝桥技术状况良好(2类),但需要解决桥面铺装裂缝和桥墩的混凝土剥落问题;而东联组桥则需重点关注桥面施工不完整及护栏损坏等问题。 适用人群:桥梁管理人员、维护工作人员及城市基础设施规划相关人员。 使用场景及目标:适用于中小跨度桥梁的常规检查与维修决策制定过程中,旨在帮助专业人士快速掌握桥梁的实际状态,确保桥梁安全可靠运行。 其他说明:文中附有多张实拍图片用于直观展示桥梁现状及存在问题。

    基于套接字API开发的高性能高稳定性跨平台MQTT客户端,可以在嵌入式设备FreeRTOS LiteOS RTThre.zip

    c语言

    【Unity 天气系统插件】Enviro 3 - Sky and Weather 高度可定制的云、雾和光照系统

    文件名:Enviro 3 - Sky and Weather v3.1.6b.unitypackage Enviro 3 - Sky and Weather 是一款功能强大的 Unity 插件,专门用于模拟逼真的天空、天气和环境效果。它适用于需要动态天气和日夜循环的游戏或应用,如开放世界 RPG、模拟类游戏等。Enviro 3 提供了大量的设置选项和自定义功能,帮助开发者在 Unity 中创建沉浸式的自然环境效果。 以下是 Enviro 3 - Sky and Weather 的一些关键特点和功能介绍: 1. 动态天气系统 天气变化:支持多种天气效果,如晴天、阴天、雨天、雪天、雾天、暴风雨等,所有天气效果可以动态切换,使游戏环境更加生动。 天气事件:允许开发者设置特定的天气事件,如风暴、雷电等,添加到游戏中的特殊场景或事件。 湿度与温度控制:可以根据天气变化动态控制湿度和温度,影响环境效果和玩家体验。 2. 日夜循环系统 动态时间系统:Enviro 3 支持实时的日夜循环,包括昼夜的过渡,太阳和月亮的运动轨迹。 光照调整:随着时间变化,Enviro 3 会自动调整环境光、

Global site tag (gtag.js) - Google Analytics