让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 相关文章推荐
window.ActiveXObject使用说明
Nov 08 Javascript
jquery scroll()区分横向纵向滚动条的方法
Apr 04 Javascript
javascript多物体运动实现方法分析
Jan 08 Javascript
Hammer.js+轮播原理实现简洁的滑屏功能
Feb 02 Javascript
js阻止默认浏览器行为与冒泡行为的实现代码
May 15 Javascript
微信小程序如何实现五星评价功能
Oct 15 Javascript
vue中对象数组去重的实现
Feb 06 Javascript
vue-autoui自匹配webapi的UI控件的实现
Mar 20 Javascript
精读《Vue3.0 Function API》
May 20 Javascript
vue样式穿透 ::v-deep的具体使用
Jun 04 Javascript
js瀑布流布局的实现
Jun 28 Javascript
js实现盒子滚动动画效果
Aug 09 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 学习资料零碎东西
2010/12/04 PHP
ThinkPHP CURD方法之field方法详解
2014/06/18 PHP
php 问卷调查结果统计
2015/10/08 PHP
PHP常见数组函数用法小结
2016/03/21 PHP
PHP设计模式之迭代器模式Iterator实例分析【对象行为型】
2020/04/26 PHP
javascript 密码强度验证规则、打分、验证(给出前端代码,后端代码可根据强度规则翻译)
2010/05/18 Javascript
jquery form 加载数据示例
2014/04/21 Javascript
javascript搜索框点击文字消失失焦时文本出现
2014/09/18 Javascript
jQuery+ajax的资源回收处理机制分析
2017/01/07 Javascript
JS字符串按逗号和回车分隔的方法
2017/04/25 Javascript
vue实现表格增删改查效果的实例代码
2017/07/18 Javascript
JS中Map和ForEach的区别
2018/02/05 Javascript
关于vue面试题汇总
2018/03/20 Javascript
在vue中使用v-bind:class的选项卡方法
2018/09/27 Javascript
Vue 一键清空表单的实现方法
2020/02/07 Javascript
[15:20]DOTA2-DPC中国联赛 正赛 Elephant vs Aster 选手采访
2021/03/11 DOTA
python中sets模块的用法实例
2014/09/30 Python
浅析Python中else语句块的使用技巧
2016/06/16 Python
python回调函数中使用多线程的方法
2017/12/25 Python
CentOS7.3编译安装Python3.6.2的方法
2018/01/22 Python
在python中按照特定顺序访问字典的方法详解
2018/12/14 Python
基于Python共轭梯度法与最速下降法之间的对比
2020/04/02 Python
Jupyter Notebook输出矢量图实例
2020/04/14 Python
Django实现celery定时任务过程解析
2020/04/21 Python
Python解析微信dat文件的方法
2020/11/30 Python
Emporio Armani腕表天猫官方旗舰店:乔治·阿玛尼为年轻人设计的副线品牌
2017/07/02 全球购物
巴西购物网站:Submarino
2020/01/19 全球购物
师范生教师实习自我鉴定
2013/09/27 职场文书
集体婚礼策划方案
2014/02/22 职场文书
挂靠协议书范本
2014/04/22 职场文书
学校总务处领导班子民主生活会对照检查材料思想汇报
2014/09/27 职场文书
行政执法队伍作风整顿个人剖析材料
2014/10/11 职场文书
人事局接收函
2015/01/30 职场文书
入党自荐书范文
2015/03/05 职场文书
好员工观后感
2015/06/17 职场文书
会计工作自我鉴定范文
2019/06/21 职场文书