让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 相关文章推荐
xss文件页面内容读取(解决)
Nov 28 Javascript
简介JavaScript中Math.LOG10E属性的使用
Jun 14 Javascript
jQuery下拉友情链接美化效果代码分享
Aug 26 Javascript
jQuery中ajax错误调试分析
Dec 01 Javascript
Javascript计算二维数组重复值示例代码
Dec 18 Javascript
Bootstrap php制作动态分页标签
Dec 23 Javascript
JavaScript数据结构之广义表的定义与表示方法详解
Apr 12 Javascript
JS排序算法之希尔排序与快速排序实现方法
Dec 12 Javascript
基于jQuery ztree实现表格风格的树状结构
Aug 31 jQuery
vue路由守卫,限制前端页面访问权限的例子
Nov 11 Javascript
Vue使用JSEncrypt实现rsa加密及挂载方法
Feb 07 Javascript
element-ui点击查看大图的方法示例
Dec 14 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
PHP的substr_replace将指定两位置之间的字符替换为*号
2011/05/04 PHP
CentOS安装php v8js教程
2015/02/26 PHP
深入理解PHP中的empty和isset函数
2016/05/26 PHP
在Laravel5.6中使用Swoole的协程数据库查询
2018/06/15 PHP
JavaScript地图拖动功能SpryMap的简单实现
2013/07/17 Javascript
javascript自动改变文字大小和颜色的效果的小例子
2013/08/02 Javascript
解决Extjs4中form表单提交后无法进入success函数问题
2013/11/26 Javascript
juery框架写的弹窗效果适合新手
2013/11/27 Javascript
node.js中的http.response.setHeader方法使用说明
2014/12/14 Javascript
JavaScript实现简单图片翻转的方法
2015/04/17 Javascript
详解JS正则replace的使用方法
2016/03/06 Javascript
JavaScript中的Reflect对象详解(ES6新特性)
2016/07/22 Javascript
jQuery中DOM节点的删除方法总结(超全面)
2017/01/22 Javascript
Javascript中构造函数要注意的一些坑
2017/01/23 Javascript
详解打造 Vue.js 可复用组件
2017/03/24 Javascript
微信小程序实现滴滴导航tab切换效果
2018/07/24 Javascript
详解如何在微信小程序中愉快地使用sass
2018/07/30 Javascript
layui表格 列自动适应大小失效的解决方法
2019/09/06 Javascript
解决vue加scoped后就无法修改vant的UI组件的样式问题
2020/09/07 Javascript
python tensorflow基于cnn实现手写数字识别
2018/01/01 Python
python爬虫之自动登录与验证码识别
2020/06/15 Python
python 实现图片旋转 上下左右 180度旋转的示例
2019/01/24 Python
搞定这套Python爬虫面试题(面试会so easy)
2019/04/03 Python
Django框架实现分页显示内容的方法详解
2019/05/10 Python
Python定时任务随机时间执行的实现方法
2019/08/14 Python
使用Python实现Wake On Lan远程开机功能
2020/01/22 Python
python爬虫模块URL管理器模块用法解析
2020/02/03 Python
python集合能干吗
2020/07/19 Python
CSS3系列教程:背景图片(背景大小和多背景图) 应用说明
2012/12/19 HTML / CSS
瑞典耳机品牌:URBANISTA
2019/12/03 全球购物
优秀驾驶员先进事迹材料
2014/05/04 职场文书
优秀党务工作者事迹材料
2014/05/07 职场文书
应届生求职信范文
2014/05/26 职场文书
2015秋季开学典礼主持词
2015/07/16 职场文书
某学校的2019年度工作报告范本
2019/10/11 职场文书
html解决浏览器记住密码输入框的问题
2023/05/07 HTML / CSS