JS窗口问题处理:使弹出窗口保持前端显示的几种方法,及window窗体对象open()和showModalDialog()用法_cq1982的博客-程序员秘密

技术标签: 前端技术  

用window.open打开一个窗口,怎么使它一直在父窗口的上面,除非点击自己设置的关闭按钮,我试了一下οnblur="self.focus"好像不管用.

可使用:

opened=window.open("demo.html","demo","left=80,top=60,width=640,height=480,help:no,resizable:no");   opened.focus();   
  self.blur();   
  }  

 

 

http://www.javaeye.com/topic/347369

 

方法一:弹出窗口<body>里加上代码:οnblur="self.focus()": 
        <body οnblur="self.focus()"> 
使用此方法时,焦点会一直在此弹出窗口上,并不能在其他窗口进行操作,焦点请不回来嘛! 

********************************************************************* 
方法二:用showModalDialog方法建立模式对话框: 
<script> 
function topwin(){ 
window.showModalDialog("D:/window.html","","dialogWidth:300px;dialogHeight:300px;scroll:no;status:no") 

</script> 
<button onClick="topwin()">打开模式窗口</button> 
此方法的效果和方法一的效果相同,弹出窗口前端显示,但是不能在其他窗口做任何操作了,也是丢了焦点。 

********************************************************************* 

方法三:用showModelessDialog方法建立无模式对话框: 
<script> 
function topwin(){ 
window.showModelessDialog("D:/window.html","","dialogWidth:300px;dialogHeight:300px;scroll:no;status:no") 

</script> 
<button onClick="topwin()">打开无模式窗口</button> 
此方法弹出窗口前端显示,但可以在其他窗口中进行操作。呵呵  做这个的时候还犯了个迷糊,在弹出窗口中增加了关闭按钮,但是写的JS函数名起为close(),这下可好了,怎么点这按钮都不好使,疑惑了好一阵,最后 把函数名改了才OK。看来起名的时候还真不能太大众化,冲突了! 哈哈 

 

 

另外一般打开窗口,并将焦点指向打开的窗口

function openSubWindow(subWin,width,height) {
    var winwidth = parseInt(width)
    var winheight = parseInt(height)
    var newWin = window.open(subWin,"SubWindow","width="+winwidth+",height="+winheight+",status=no, menubar=no, toolbar=no, scrollbars=yes");
    newWin.focus();
}

 

 

关于window窗体对象open()和showModalDialog()用法

http://www.javaeye.com/topic/188709

[javascript]  view plain copy
  1. 一、window.open()支持环境: JavaScript1.0+/JScript1.0+/Nav2+/IE3+/Opera3+  
  2. 二、基本语法:  
  3. window.open(pageURL,name,parameters)  
  4. 其中:  
  5. pageURL 为子窗口路径  
  6. name 为子窗口句柄  
  7. parameters 为窗口参数(各参数用逗号分隔)  
  8. 三、示例:  
  9. <SCRIPT>  
  10. <!--  
  11. window.open ('page.html','newwindow','height=100,width=400,top=0,left=0,toolbar=no,menubar=no,scrollbars=no, resizable=no,location=no, status=no')  
  12. //写成一行  
  13. -->  
  14. </SCRIPT>  
  15. 脚本运行后,page.html将在新窗体newwindow中打开,宽为100,高为400,距屏顶0象素,屏左0象素,无工具条,无菜单条,无滚动条,不可调整大小,无地址栏,无状态栏。  
  16. 请对照。  
  17. 上例中涉及的为常用的几个参数,除此以外还有很多其他参数,请见四。  
  18. 四、各项参数  
  19. 其中yes/no也可使用1/0;pixel value为具体的数值,单位象素。  
  20. 参数 | 取值范围 | 说明  
  21. | |  
  22. alwaysLowered | yes/no | 指定窗口隐藏在所有窗口之后  
  23. alwaysRaised | yes/no | 指定窗口悬浮在所有窗口之上  
  24. depended | yes/no | 是否和父窗口同时关闭  
  25. directories | yes/no | Nav2和3的目录栏是否可见  
  26. height | pixel value | 窗口高度  
  27. hotkeys | yes/no | 在没菜单栏的窗口中设安全退出热键  
  28. innerHeight | pixel value | 窗口中文档的像素高度  
  29. innerWidth | pixel value | 窗口中文档的像素宽度  
  30. location | yes/no | 位置栏是否可见  
  31. menubar | yes/no | 菜单栏是否可见  
  32. outerHeight | pixel value | 设定窗口(包括装饰边框)的像素高度  
  33. outerWidth | pixel value | 设定窗口(包括装饰边框)的像素宽度  
  34. resizable | yes/no | 窗口大小是否可调整  
  35. screenX | pixel value | 窗口距屏幕左边界的像素长度  
  36. screenY | pixel value | 窗口距屏幕上边界的像素长度  
  37. scrollbars | yes/no | 窗口是否可有滚动栏  
  38. titlebar | yes/no | 窗口题目栏是否可见  
  39. toolbar | yes/no | 窗口工具栏是否可见  
  40. Width | pixel value | 窗口的像素宽度  
  41. z-look | yes/no | 窗口被激活后是否浮在其它窗口之上  
  42. window.showModalDialog使用手册  
  43. 基本介绍:  
  44. showModalDialog() (IE 4+ 支持)  
  45. showModelessDialog() (IE 5+ 支持)  
  46. window.showModalDialog()方法用来创建一个显示HTML内容的模态对话框。  
  47. window.showModelessDialog()方法用来创建一个显示HTML内容的非模态对话框。  
  48. 使用方法:  
  49. vReturnValue = window.showModalDialog(sURL [, vArguments] [,sFeatures])  
  50. vReturnValue = window.showModelessDialog(sURL [, vArguments] [,sFeatures])  
  51. 参数说明:  
  52. sURL--  
  53. 必选参数,类型:字符串。用来指定对话框要显示的文档的URL。  
  54. vArguments--  
  55. 可选参数,类型:变体。用来向对话框传递参数。传递的参数类型不限,包括数组等。对话框通过window.dialogArguments来取得传递进来的参数。  
  56. sFeatures--  
  57. 可选参数,类型:字符串。用来描述对话框的外观等信息,可以使用以下的一个或几个,用分号“;”隔开。  
  58. 1.dialogHeight :对话框高度,不小于100px,IE4中dialogHeight 和 dialogWidth 默认的单位是em,而IE5中是px,为方便其见,在定义modal方式的对话框时,用px做单位。  
  59. 2.dialogWidth: 对话框宽度。  
  60. 3.dialogLeft: 离屏幕左的距离。  
  61. 4.dialogTop: 离屏幕上的距离。  
  62. 5.center: {yes | no | 1 | 0 }:窗口是否居中,默认yes,但仍可以指定高度和宽度。  
  63. 6.help: {yes | no | 1 | 0 }:是否显示帮助按钮,默认yes。  
  64. 7.resizable: {yes | no | 1 | 0 } [IE5+]:是否可被改变大小。默认no。  
  65. 8.status: {yes | no | 1 | 0 } [IE5+]:是否显示状态栏。默认为yes[ Modeless]或no[Modal]。  
  66. 9.scroll:{ yes | no | 1 | 0 | on | off }:指明对话框是否显示滚动条。默认为yes。  
  67. 下面几个属性是用在HTA中的,在一般的网页中一般不使用。  
  68. 10.dialogHide:{ yes | no | 1 | 0 | on | off }:在打印或者打印预览时对话框是否隐藏。默认为no。  
  69. 11.edge:{ sunken | raised }:指明对话框的边框样式。默认为raised。  
  70. 12.unadorned:{ yes | no | 1 | 0 | on | off }:默认为no。  
  71. 参数传递:  
  72. 1.要想对话框传递参数,是通过vArguments来进行传递的。类型不限制,对于字符串类型,最大为4096个字符。也可以传递对象,例如:  
  73. -------------------------------  
  74. parent.htm  
  75. <mce:script type="text/javascript"><!--  
  76. var obj = new Object();  
  77. obj.name="51js";  
  78. window.showModalDialog("modal.htm",obj,"dialogWidth=200px;dialogHeight=100px");  
  79. // --></mce:script>  
  80. modal.htm  
  81. <mce:script type="text/javascript"><!--  
  82. var obj = window.dialogArguments  
  83. alert("您传递的参数为:" + obj.name)  
  84. // --></mce:script>  
  85. -------------------------------  
  86. 2.可以通过window.returnValue向打开对话框的窗口返回信息,当然也可以是对象。例如:  
  87. ------------------------------  
  88. parent.htm  
  89. <mce:script type="text/javascript"><!--  
  90. str =window.showModalDialog("modal.htm",,"dialogWidth=200px;dialogHeight=100px");  
  91. alert(str);  
  92. // --></mce:script>  
  93. modal.htm  
  94. <mce:script type="text/javascript"><!--  
  95. window.returnValue="http://www.51js.com";  
  96. // --></mce:script>  
  97. 币种定义部分  
  98. var psAddStr="ProcessID="+ProcessID+"&AddFlag="+isAddFlag+"&BZBH="+vsBZBH+"&BZMC="+vsBZMC+"&BZFH="+vsBZFH+"&JD="+vsJD;  
  99. var Result=window.showModalDialog("addSave.asp?"+psAddStr,'',"dialogHeight:250px;dialogWidth:250px;status:no;");  
  100. -----------------------------使用总结-------------------------  
  101. 模式窗体  
  102. var returnval=window.showModalDialog(url,window,"dialogWidth=220px;dialogHeight=530px");  
  103. 注意第2个参数传递为window作用是可在弹出的窗体中访问父窗口里面的属性或方法,访问形式如下:  
  104. dialogArguments.parentfun(){};  
  105. returnvalue是一个返回数值,不能是文档对象,而是一个简单的Javascript对象(String,Date...)  
  106. window.returnValue="123";那么returnval的数值是123  
  107. open弹出的窗体  
  108. var obj=window.open(url,'','location=no,menubar=no,scroll=yes,height=756px,width=940px,resizable=no,status=yes');  
  109. 访问父页面方法:如下:  
  110. window.opener.parfun(){}  
  111. 注意obj是对弹出的窗体的一个引用,可以调用obj.close()方法关闭弹出的窗体.  

 

http://www.javaeye.com/topic/112626

总结性文章如下

Javascript 弹出窗口总结http://e-ant.javaeye.com/blog/307650

总结:子窗口创建及父窗口与子窗口之间通信

http://super-094.javaeye.com/blog/205905

如何使模态窗口关闭后刷新父页面

http://www.javaeye.com/problems/2372

版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/cq1982/article/details/44747749

智能推荐

php下拉框css样式,用纯css改变下拉列表select框的默认样式_html/css_WEB-ITnose_oniT Tino的博客-程序员秘密

将浏览器默认的下拉框样式清除,然后应用上自己的,再附一张向右对齐小箭头的图片即可。1 select { 2 /*Chrome和Firefox里面的边框是不一样的,所以复写了一下*/ 3 border: solid 1px #000; 4 5 /*很关键:将默认的select选择框样式清除*/ 6 appearance:none; 7 -moz-appearance:none; 8 ...

img图片 保持比例、居中显示_img保持比例_shijie_nihao的博客-程序员秘密

外部容器设置 固定宽度高度,设置line-height与height相等(垂直居中),设置text-align是center(水平居中),内部img设置style(max-height:100%;max-width:100%;vertical-align: middle; margin: 0 auto;)。 &lt;div style="width: 398px;height: 298px;line-height: 298px;text-align: center;borde...

前端开发【第一篇: HTML】_weixin_34234829的博客-程序员秘密

HTML初识1.什么是HTML?HTML是英文HyperText Mark-up Language(超文本标记语言)的缩写,他是一种制作万维网页面标准语言(标记)。2、网页的组成我们平时看到的网页一般由3个部分组成:HTML(Hypertext Markup Language)CSS(Cascade Style Sheets)JavaScript上面3...

JDBC连接数据库的经典案例_jdbc访问数据库的例子_坛子成长记的博客-程序员秘密

package com.execlExport.util;import java.sql.Connection;import java.sql.DriverManager;import java.sql.PreparedStatement;import java.sql.ResultSet;import java.sql.SQLException;/** * DatabaseUti

海航重组当当,航机飘上书香_老胡说科技的博客-程序员秘密

3月9日,当海航系旗下的天海投资公告披露将收购当当网股权时,当当网董事长俞渝正拿着拉杆箱,提着白色滑雪头盔坐上北京飞牡丹江的国航。俞渝的淡定更像是胸有成竹,一个月后的4月11日,海航旗下天海投资与当当网正式签订重组协议,“海航+当当”组合正式上路,于无声中开启了新零售的新变局。公告显示,海航旗下天海投资以75亿的价格收购当当100%股权,这场联姻意味着:海航不仅获得了当当这个文化电商独角兽的股权,

猴子吃桃递归和尾递归--JavaScript版_ReadyYes的博客-程序员秘密

有一只猴子摘了一堆桃子,当即吃了一半,可是桃子太好吃了,它又多吃了一个,第二天它把第一天剩下的桃子吃了一半,又多吃了一 个, 就这样到第十天早上它只剩下一个桃子了,问它一共摘了多少个桃子?(1534)逆向思维实现 var day = 9; var total = 0; var lastNum = 1 ;//第十天只剩下一个桃子 while(day>0){ lastNum

随便推点

Linux---ISCSI网络磁盘共享_Argued_D的博客-程序员秘密

ISCSI 名称设定iSCSI 发起端 : 需要访问原始 SAN 存储的客户端 iSCSI 目标 : 从 ISCSI 服务器提供的远程硬盘磁盘 , 或“目标门户” iSCSI 目标门户 : 通过网络向发起端提供目标的服务器。IQN:“iSCSI 限定名称”。每个发起端和目标需要唯一名称进行标识最好的做法是使用一个在 Internet 上可能独一无二的名称。ISCSI的作用ISC...

数据结构基础系列(9):排序-贺利坚-专题视频课程_迂者-贺利坚的博客-程序员秘密

数据结构课程是计算机类专业的专业基础课程,在IT人才培养中,起着重要的作用。课程按照大学计算机类专业课程大纲的要求,安排教学内容,满足需要系统学习数据结构的人。系列课程包含11个部分,本课为第9部分排序,介绍插入排序、交换排序、选择排序、归并排序、基数排序等各种排序算法,以及各种算法的性能分析。...

python处理缺失数据、过滤,填补-----python进行数据分析_python数据治理通过查询补全_海人001的博客-程序员秘密

目录处理缺失数据滤除缺失数据填补缺失数据处理缺失数据pandas的设计目标之一就是让缺失数据的处理任务更轻松,pandas使用浮点值NaN表示浮点数组和非浮点数组中的缺失数据,是一个便于被检测的标记python内置的None也会被当作NA处理from pandas import Series&amp;gt;&amp;gt;&amp;gt; string_data = Series(['aa...

MQTT-MQTT代理服务器Mosqitto安装和测试_test.mosquitto.org_孤独的小丑的博客-程序员秘密

Mosqitto是Eclipse推出的开源的MQTT broker,支持MQTT3.1和3.1.1协议,是个轻量级的服务器。其官网地址为:https://mosquitto.org/MQ 遥测传输 (MQTT) V3.1 协议规范:http://www.ibm.com/developerworks/cn/webservices/ws-mqtt/index.html1 安装1.1 安装...

c语言条件语句示例_带有示例的C / C ++教程中的Switch Case语句_cunjiu9486的博客-程序员秘密

c语言条件语句示例C/C++ programming languages provides switch ... case statement for selection according to given switch state. switch ... case can be used for different cases in order to control the flow of ...

Win10+GTX1660Ti+CUDA10.1+cuDNN v7.6.4+Anaconda+PyCharm配置GPU版本PyTorch超详细步骤_智信仁勇严道的博客-程序员秘密

pytorch配置PyTorch官网下载链接https://pytorch.org/快捷键 Windows + R输入cmd回车

推荐文章

热门文章

相关标签