Javascript 里面也有模式对话框和非模式对话框的概念,说的这么复杂,其实两者区别就是是在对话框被关闭之前用户能否在同一页面的其他地方进行工作。比如“打开文件” 对话框便是典型的模式对话框,在你对这个对话框做出动作才能对打开该对话框的程序进行其他操作,而非模式对话框则不必
javascript里面打开模式对话框是showModalDialog(),非模式对话框是 showModalessDialog(),IE5+支持直接调用该方法,但对以下版本需使用window.来调用,我比较喜欢的是使用后者,因为这样我的程序会好看 --!!
vReturnValue = window.showModalDialog(sURL [, vArguments] [,sFeatures])
vReturnValue = window.showModelessDialog(sURL [, vArguments] [,sFeatures])
上面面是两个函数的表达式,vReturnValue当然就是返回值了;sURL必选,为你要打开的页面; vArguments可选,用来向对话框传递参数;sFeatures可选,打开对话框的属性,各个属性直接用;隔开,下面是我Google到的一下 sFeatures的参数,供参考:
1. dialogHeight: 对话框高度(单位有em和px等,我一般用px)
2. dialogWidth: 对话框宽度(同height)
3. dialogLeft: 离屏幕左的距离
4. dialogTop: 离屏幕上的距离
5. center: { yes | no | 1 | 0 } : 口是否居中,默认yes,但仍可以指定高度和宽度
6. help: {yes | no | 1 | 0 }: 是否显示帮助按钮,默认yes
7. resizable: {yes | no | 1 | 0 } [IE5+]: 是否可被改变大小,默认no
8. status: {yes | no | 1 | 0 } [IE5+]: 是否显示状态栏。默认为yes[ Modeless]或no[Modal]
9. scroll: { yes | no | 1 | 0 | on | off }:指明对话框是否显示滚动条。默认为yes
10. dialogHide:{ yes | no | 1 | 0 | on | off }:在打印或者打印预览时对话框是否隐藏。默认为no
11. edge:{ sunken | raised }:指明对话框的边框样式。默认为raised
12. unadorned:{ yes | no | 1 | 0 | on | off }:默认为no
这里需要说明的一点就是在设置打开窗口属性时,即sFeatures,一定不要忘了feature前面是argument,要像 window.showModalDialog(sURL,"","resizable:yes;scroll:no;")这样,我就犯过这种错误。
分享到:
相关推荐
Javascript里面分模式对话框和非模式对话框,其实两者区别就是在对话框被关闭之前用户能否在同一页面的其他地方进行工作。比如“打开文件”对话框便是典型的模式对话框,在你对这个对话框做出动作才能对打开该对话框...
介绍了javascript中模式对话框的用法 (showModalDialog)
一个简单的,纯CSS的解决方案,用于改进Bootstrap 4模式对话框在手机上的用户体验。
Micromodal.js⭕使用纯JavaScript编写轻量级,可配置的模式对话框库
漂亮的模式对话框 找了好久 于大家分享 !!!!!!!!!!
对话框可以分为模式对话框和无模式对话框两种,两者区别是在对话框被关闭之前用户能否在同一应用程序的其他地方进行工作。举例说明:打开文件对话框便是典型的模式对话框,在你选择好要打开的文件按下确定后,或者...
在这里我将向您全面介绍Javascript提示的3种模式
rmodal.js, 一个简单的1.2 KB模式对话框, 1.2 知识库模式对话框,没有相关性 一个简单而快速的模态对话框纯 JavaScript - 无依赖关系支持的所有浏览器( IE9+ )压缩和缩小时小于 1.2 KBBootstrap 和 Anima
Light Modal 一个简单轻便但功能强大且可自定义的CSS模式对话框
通过查阅资料,选择使用ngDialog来实现,ngDialog是一个用于Angular.js应用的模式对话框和弹出窗口。ngDialog非常小(?2K),拥有简约的API,通过主题高度可定制的,具有唯一的依赖Angular.js。 ngDialog github地址...
微型,无依赖的javascript库,用于创建可访问的模式对话框 该库的目的是通过最少的配置使模式对话框易于访问,并易于包含在项目中。 压缩后压缩后只有〜1.8kb的大小-一个小库,可进行大更改。 产品特点 :heavy_...
4:这些方法都模拟了Windows的模式对话框。在你改变改变浏览器窗口大小时候,它能够自适应用户 窗口的调整。 5:如果你引入了jQuery UI Draggable plugin插件,那这个插件也可以被自由拖动。 详细出处参考:...
用于引导程序的eModal eModal是使用引导程序管理模式对话框的简便方法。 当前版本1.2.69快速入门链接到eModal.js <脚本src =“ https://unpkg.com/ [受电子邮件保护] /dist/eModal.mi用于引导程序的eModal eModal...
React模式对话框是在考虑一些基本假设和约束的基础上构建的: 当您有两个对话框时,ESC键只会关闭最上一级的对话框(有一个像堆栈一样实现的事件管理器) 程序包需要支持带有弹簧动画的对话框(不仅是标准的缓入,...
可访问的模态对话框用ES5编写的原始JavaScript,可访问的模式对话框脚本。 请参阅。安装您可以获得此软件包: $ npm i aria-modal-dialog 克隆它: $ git clone ...
实例388 在弹出的网页模式对话框中选择个性头像 645 实例389 时间选择器 647 实例390 弹出提示对话框并重定向网页 649 实例391 删除数据前弹出确认对话框 650 18.2 其他 651 实例392 树状导航菜单 651 ...
在元素上鼠标悬停时调用,并在元素失去焦点后隐藏dialogModal-大内容或内容集合的模式对话框,显示在所有元素的顶部。 通过单击元素调用titleModal-工具提示,显示在父元素附近,替换本机标题。 在元素上鼠标悬停时...
引导等待具有引导程序进度条的“正在等待...”模式对话框。 实际使用此插件 :rocket: : : 产品特点兼容AMD 可配置的正在安装有凉亭您可以使用bower bower install bootstrap-waitingfor来安装此模块,并包括来自...