-
IE6.0中window.open之怪现象5
最近项目中遇到很奇怪的一个现象,不知道各位以前有没遇到过, 就是在一个新打开的子窗口上使用了一个div遮罩, 但是问题来了,就是在父窗口上不断地点击超链接,则不断地弹出新的子窗口,也就是点了几下,则弹出几个新子窗口,但是在window.open中的name参数是一样的,按理是在父窗口上点击超链接,只是在第一次弹出的子窗口中不断地刷新页面。这让我很是困惑。
这是从http://www.w3school.com.cn网站上的一段关于window.open的描述。
事实上,在一般情况下也确实如此,但是这此的情况却有点特殊,请看代码:
mainWindow.html:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>mainwindow</title> </head> <body class="bodyBackground"> <a href="#" onclick='openWin()'>click it</a> <script type="text/javascript" > <!-- function openWin() { window.open('childWindow.html', 'win', 'height=600, width=1000, toolbar=no,location=yes, menubar=no, resizable=yes,scrollbars=yes'); } //--> </script> </body> </html>
childWindow.html:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <title>childWindow</title> <script src="Mask.js" type="text/javascript"></script> </head> <body class="bodyBackground"> <div id="test" style="border: 0pt none ; width: 500px; height: 500px; text-align: center;"> <p>asdasdasd</p> <p>asdasdasd</p> <p>asdasdasd</p> <p>asdasdasd</p> <p>asdasdasd</p> <p>asdasdasd</p> <p>asdasdasd</p> <p>asdasdasd</p> <p>asdasdasd</p> <p>asdasdasd</p> </div> <input type="button" onclick="mask.mask();" value="open" /> <input type="button" onclick="mask.unmask()" value="close" /> </body> </html>
最后是Mask.js:
var Class = { create: function() { return function() { this.initialize.apply(this, arguments); } } } //mask class var Mask = Class.create(); Mask.prototype = { maskDiv: document.createElement("div"), maskComponent: null, initialize: function() { document.body.appendChild(this.maskDiv); }, init : function(maskComponentId, showMsg) { this.maskComponent = document.getElementById(maskComponentId); this.maskDivId = this.maskDiv.id = 'maskDiv'; this.maskDiv.innerHTML = showMsg; /* var styles = { "border": "1px solid gray", "position": "absolute", "height": this.maskComponent.offsetHeight + 'px', "width": this.maskComponent.offsetWidth + 'px', "top": this.getTop(this.maskComponent) + 'px', "left": this.getLeft(this.maskComponent) + 'px', "backgroundColor": "gray", "color": "white", "fontSize": "24px", "fontFamily": "Aria", "fontWeight": "bold", "indexZ": 999, "textAlign": "center", "verticalAlign": "middle", "display": "none" } for (name in styles) this.maskDiv.style[name] = styles[name]; */ this.maskDiv.style["border"] = "1px solid gray"; this.maskDiv.style["position"] = "absolute"; this.maskDiv.style["height"] = this.maskComponent.offsetHeight + 'px'; this.maskDiv.style["width"] = this.maskComponent.offsetWidth + 'px'; this.maskDiv.style["top"] = this.getTop(this.maskComponent) + 'px'; this.maskDiv.style["left"] = this.getLeft(this.maskComponent) + 'px'; this.maskDiv.style["backgroundColor"] = "gray"; this.maskDiv.style["color"] = "white"; this.maskDiv.style["fontSize"] = "24px"; this.maskDiv.style["fontFamily"] = "Aria"; this.maskDiv.style["fontWeight"] = "bold"; this.maskDiv.style["indexZ"] = 999; this.maskDiv.style["textAlign"] = "center"; this.maskDiv.style["verticalAlign"] = "middle"; this.maskDiv.style["display"] = "none"; //this.setOpacity(this.maskDivId, 0.5); }, mask: function(){ this.maskDiv.style["height"] = this.maskComponent.offsetHeight + 'px'; this.maskDiv.style["width"] = this.maskComponent.offsetWidth + 'px'; this.maskDiv.style["top"] = this.getTop(this.maskComponent) + 'px'; this.maskDiv.style["left"] = this.getLeft(this.maskComponent) + 'px'; this.maskDiv.style["display"] = "block"; }, unmask: function() { this.maskDiv.style["display"] = "none"; }, getTop: function(e){ var offset=e.offsetTop; if(e.offsetParent!=null) offset+=this.getTop(e.offsetParent); return offset; }, getLeft: function(e){ var offset=e.offsetLeft; if(e.offsetParent!=null) offset+=this.getLeft(e.offsetParent); return offset; } } var mask = null; function init() { mask = new Mask(); mask.init('test', 'Loading...'); } var oldonload = window.onload; if (typeof window.onload != 'function') { window.onload = init; } else { window.onload = function() { oldonload(); init(); } }
这样的情况下是完全正常的,不管在mainWindow.html上点击“click it”这个超链接多少次,他总是会在第一个弹出的子窗口刷新页面。我们也可以在子窗口的地址栏输入:javascript:alert(window.name) 进行查看,如下图:
window.name确实也为‘win’。
但是当我们把Mask.js中init方法改为如下:
var Class = { create: function() { return function() { this.initialize.apply(this, arguments); } } } //mask class var Mask = Class.create(); Mask.prototype = { maskDiv: document.createElement("div"), maskComponent: null, initialize: function() { document.body.appendChild(this.maskDiv); }, init : function(maskComponentId, showMsg) { this.maskComponent = document.getElementById(maskComponentId); this.maskDivId = this.maskDiv.id = 'maskDiv'; this.maskDiv.innerHTML = showMsg; var styles = { "border": "1px solid gray", "position": "absolute", "height": this.maskComponent.offsetHeight + 'px', "width": this.maskComponent.offsetWidth + 'px', "top": this.getTop(this.maskComponent) + 'px', "left": this.getLeft(this.maskComponent) + 'px', "backgroundColor": "gray", "color": "white", "fontSize": "24px", "fontFamily": "Aria", "fontWeight": "bold", "indexZ": 999, "textAlign": "center", "verticalAlign": "middle", "display": "none" } for (name in styles) this.maskDiv.style[name] = styles[name]; /* this.maskDiv.style["border"] = "1px solid gray"; this.maskDiv.style["position"] = "absolute"; this.maskDiv.style["height"] = this.maskComponent.offsetHeight + 'px'; this.maskDiv.style["width"] = this.maskComponent.offsetWidth + 'px'; this.maskDiv.style["top"] = this.getTop(this.maskComponent) + 'px'; this.maskDiv.style["left"] = this.getLeft(this.maskComponent) + 'px'; this.maskDiv.style["backgroundColor"] = "gray"; this.maskDiv.style["color"] = "white"; this.maskDiv.style["fontSize"] = "24px"; this.maskDiv.style["fontFamily"] = "Aria"; this.maskDiv.style["fontWeight"] = "bold"; this.maskDiv.style["indexZ"] = 999; this.maskDiv.style["textAlign"] = "center"; this.maskDiv.style["verticalAlign"] = "middle"; this.maskDiv.style["display"] = "none"; //this.setOpacity(this.maskDivId, 0.5); */ }, mask: function(){ this.maskDiv.style["height"] = this.maskComponent.offsetHeight + 'px'; this.maskDiv.style["width"] = this.maskComponent.offsetWidth + 'px'; this.maskDiv.style["top"] = this.getTop(this.maskComponent) + 'px'; this.maskDiv.style["left"] = this.getLeft(this.maskComponent) + 'px'; this.maskDiv.style["display"] = "block"; }, unmask: function() { this.maskDiv.style["display"] = "none"; }, getTop: function(e){ var offset=e.offsetTop; if(e.offsetParent!=null) offset+=this.getTop(e.offsetParent); return offset; }, getLeft: function(e){ var offset=e.offsetLeft; if(e.offsetParent!=null) offset+=this.getLeft(e.offsetParent); return offset; } } var mask = null; function init() { mask = new Mask(); mask.init('test', 'Loading...'); } var oldonload = window.onload; if (typeof window.onload != 'function') { window.onload = init; } else { window.onload = function() { oldonload(); init(); } }
问题就来了,我们不断地在mainWindow.html上点击‘click it’, 他会不断地跳出新的子窗口,于是我在每个子窗口的地址栏输入:javascript:alert(window.name) ,发现他们的window.name竟然都是一样的! 如下图:
希望哪位高手看到了不吝赐教,解除我的困惑。。 我并没觉得mask.js中的修改的代码哪里有问题。。只是一个是循环赋值,一个直接赋值罢了。。。真是百思不得其解。。
2009年5月19日 14:12
目前还没有答案
相关推荐
RealtekHighDefinitionAudioDrivers6.0.9191.1WHQLx64.7z
audio_realtek_6.0.1.8591_w71064.zip
ncurses-6.0.tar.gz
unzip-6.0-19.el7.x86_64.rpm
VC++6.0中文版.zipVC++6.0中文版.zipVC++6.0中文版.zipVC++6.0中文版.zipVC++6.0中文版.zipVC++6.0中文版.zipVC++6.0中文版.zipVC++6.0中文版.zipVC++6.0中文版.zipVC++6.0中文版.zipVC++6.0中文版.zipVC++6.0中文版...
PLSQL Developer 6.0.0.840 汉化版.rar 使用oracle必不可少的工具
电脑端控制手机摄像头,亲测有效,电脑端DroidCam.Client.6.0.FullOffline.rar
audio_realtek_6.0.1.8216_w1064.zip驱动音频驱动音频驱动音频
zabbix-release-6.0-1.el7.noarch.rpm
Realtek最新声卡驱动Realtek HD Audio Driver 6.0.1.8591 WHQL
windows远程RDPWrap[6.0.6001.18000]配置文件 windows远程RDPWrap[6.0.6001.18000]配置文件 windows远程RDPWrap[6.0.6001.18000]配置文件 windows远程RDPWrap[6.0.6001.18000]配置文件 windows远程RDPWrap[6.0.6001....
COMSOL.Multiphysics.6.0.318.Win.Linux.macOS-SSQ,不知道更新了啥,某雷下载的速度还可以。
极域简体中文V6.0_2.7.13488.1712
手动安装readline-devel-6.0-4.el6.x86_64。完美解决报错:readline-devel-6.0-4.el6.x86_64: failure: Packages/readline-devel-6.0-4.el6.x86_64.rpm from c6-media
unzip-6.0-1.el6.x86_64.rpm
福昕风腾PDF套件金山版(标准版)v6.0.6.715官方零售版免激活永久授权版
TensorRT 6.0.1.5.Windows10版本.x86_64平台.cuda-10.0.cudnn7.6
Realtek High Definition Audio驱动版本:6.0.1.8485-更新日期:20180710公版驱动-2A_ASUS_1563198157.zip 公版驱动程序。 有选项,可以干掉麦克风的底噪! 噪音抑制:用于在录音时降低静态背景噪音 回声消除:...
Visual.Assist.v6.0.0.1079 Visual.Assist.v6.0.0.1079
VC 6.0.zipVC 6.0.zipVC 6.0.zipVC 6.0.zipVC 6.0.zipVC 6.0.zipVC 6.0.zipVC 6.0.zipVC 6.0.zipVC 6.0.zipVC 6.0.zipVC 6.0.zipVC 6.0.zipVC 6.0.zipVC 6.0.zipVC 6.0.zipVC 6.0.zipVC 6.0.zipVC 6.0.zipVC 6.0....