让js弹出窗口居前显示的实现方法


Posted in Javascript onJuly 10, 2013

具体步骤:

方法一:弹出窗口<body>里加上代码:onblur="self.focus()":
<body onblur="self.focus()">

方法二:用showModalDialog方法建立模式对话框,它的参数说明如表1.5.2所示。
<script>
   function topwin(){
   window.showModalDialog(http://www.3water.com,"","dialogWidth:300px;dialogHeight:300px;scroll:no;status:no")
   }
</script>
<button onClick="topwin()">打开模式窗口</button>

方法三:用showModelessDialog方法建立无模式对话框,它的参数跟模式对话框完全一样,可以参考表1.5.2。
<script>
   function topwin(){
   window.showModelessDialog("https://3water.com","","dialogWidth:300px;dialogHeight:300px;scroll:no;status:no")
   }
</script>
<button onClick="topwin()">打开无模式窗口</button>

注意:模式对话框会始终保持焦点。除非关闭对话框,否则无法切换窗口。 无模式对话框不会始终保持焦点,但始终保持显示在最前端。

特别说明
本例主要是模式对话框和无模式对话框的应用,必须注意两种对话框的异同。

表1.5.2 showModalDialog方法的参数列表
参数取值说明
sURL必选项。字符串(String)。指定要载入和显示的 URL。
vArguments可选项。字符串(String)。指定供显示文档时使用的变量。利用这个参数可以传递任何类型的值,包括包含多个值得的数组。对话框可以通过调用程序从 window 对象的 dialogArguments 属性提取这些值。
sFeatures可选项。字符串(String)。指定对话框的窗口装饰。使用下面的值。多个之间用分号隔开。
dialogHeight : sHeight设置对话框的高度
dialogLeft : sXPos设置对话框左上角相对于桌面的横坐标。
dialogTop : sYPos设置对话框左上角相对于桌面的纵坐标。
dialogWidth : sWidth设置对话框的宽度。
center : yes | no | 1 | 0 | on | off指定对话框是否显示于桌面正中。默认值为 yes 。
dialogHide : yes | no| 1 | 0 | on | off指定当打印或打印预览时对话框是否隐藏。仅仅当对话框是由被信任的程式打开的时候此参数才可用。默认值为 no 。
edge : sunken | raised指定对话框窗口边框样式为凹下还是凸起的。默认值为 raised 。
help : yes | no | 1 | 0 | on | off指定对话框是否显示上下文相关的帮助图标。默认值为 yes 。
resizable : yes | no | 1 | 0 | on | off指定对话框是否可以被用户改变尺寸。默认值为 no 。
scroll : yes | no | 1 | 0 | on | off指定对话框是否显示滚动条。默认值为 yes 。
status : yes | no | 1 | 0 | on | off指定对话框是否显示状态条。对于不被信任的对话框默认值为 yes 。对于被信任的对话框默认值为 no 。
unadorned : yes | no | 1 | 0 | on | off指定对话框是否显示 chrome 样式边框。仅仅当对话框是由被信任的程式打开的时候此参数才可用。默认值为 no 。

Javascript 相关文章推荐
了不起的node.js读书笔记之node的学习总结
Dec 22 Javascript
jQuery扁平化风格下拉框美化插件FancySelect使用指南
Feb 10 Javascript
JS右下角广告窗口代码(可收缩、展开及关闭)
Sep 04 Javascript
AngularJS过滤器详解及示例代码
Aug 16 Javascript
轻松掌握JavaScript单例模式
Aug 25 Javascript
Vue监听数组变化源码解析
Mar 09 Javascript
EasyUI创建人员树的实例代码
Sep 15 Javascript
js实现移动端轮播图
Dec 21 Javascript
highCharts提示框中显示当前时间的方法
Jan 18 Javascript
layui prompt 设置允许空白提交的方法
Sep 24 Javascript
Vue + Node.js + MongoDB图片上传组件实现图片预览和删除功能详解
Apr 29 Javascript
vue+koa2搭建mock数据环境的详细教程
May 18 Javascript
JavaScript:new 一个函数和直接调用函数的区别分析
Jul 10 #Javascript
浅析onsubmit校验表单时利用ajax的return false无效问题
Jul 10 #Javascript
JavaScript 模拟类机制及私有变量的方法及思路
Jul 10 #Javascript
js固定DIV高度,超出部分自动添加滚动条的简单方法
Jul 10 #Javascript
javascript 手动给表增加数据的小例子
Jul 10 #Javascript
基于javascript 闭包基础分享
Jul 10 #Javascript
关于include标签导致js路径找不到的问题分析及解决
Jul 09 #Javascript
You might like
PHPThumb PHP 图片缩略图库
2012/03/11 PHP
php5.4传引用时报错问题分析
2016/01/22 PHP
Prototype Selector对象学习
2009/07/23 Javascript
如何确保JavaScript的执行顺序 之jQuery.html并非万能钥匙
2011/03/03 Javascript
js的表单操作 简单计算器
2011/12/29 Javascript
jQuery UI插件自定义confirm确认框的方法
2015/03/20 Javascript
JavaScript中的slice()方法使用详解
2015/06/06 Javascript
解决angular的post请求后SpringMVC后台接收不到参数值问题的方法
2015/12/10 Javascript
js获取及修改网页背景色和字体色的方法
2015/12/29 Javascript
JS闭包与延迟求值用法示例
2016/12/22 Javascript
phantomjs导出html到pdf的方法总结
2017/10/19 Javascript
vue-router判断页面未登录自动跳转到登录页的方法示例
2018/11/04 Javascript
详解在网页上通过JS实现文本的语音朗读
2019/03/28 Javascript
js实现页面图片消除效果
2020/03/24 Javascript
es6函数中的作用域实例分析
2020/04/18 Javascript
Vue2.0 ES6语法降级ES5的操作
2020/10/30 Javascript
ES6的循环与可迭代对象示例详解
2021/01/31 Javascript
详解vite2.0配置学习(typescript版本)
2021/02/25 Javascript
Python实现比较扑克牌大小程序代码示例
2017/12/06 Python
使用Python+Splinter自动刷新抢12306火车票
2018/01/03 Python
Django中使用session保持用户登陆连接的例子
2019/08/06 Python
Django调用支付宝接口代码实例详解
2020/04/04 Python
Python requests模块cookie实例解析
2020/04/14 Python
css3 flex实现div内容水平垂直居中的几种方法
2020/03/27 HTML / CSS
Schutz鞋官方网站:Schutz Shoes
2017/12/13 全球购物
正宗的日本零食和糖果订阅盒:Bokksu
2019/11/21 全球购物
证券期货行业个人的自我评价
2013/12/26 职场文书
园林毕业生自我鉴定范文
2013/12/29 职场文书
体育教师求职信
2014/05/24 职场文书
学习型党组织心得体会
2014/09/12 职场文书
劳动保障个人工作总结
2015/03/04 职场文书
话题作文之成长
2019/12/09 职场文书
Redis Cluster 字段模糊匹配及删除
2021/05/27 Redis
基于PyTorch实现一个简单的CNN图像分类器
2021/05/29 Python
html实现弹窗的实例
2021/06/09 HTML / CSS
Python re.sub 反向引用的实现
2021/07/07 Python