代码改变世界

打开窗口,关闭窗口

2013-04-10 16:06  Barret李靖  阅读(2155)  评论(0编辑  收藏  举报

关键词:window.open() window.close() showModalDialog() 兼容性 测试等。

    本文默认你对以上函数参数有基本了解。

window.open

  window.open如果没有加第三个参数,则浏览器一般都会在新的标签页打开(除非你设置了新建窗口打开)

  而有的时候,我们需要他弹出来。就想这个一样:

  

  上述方式是:

window.open(/*URL*/"",/*Name*/"",/*args*/"width=300,height=400");

  但是搜狗是不会挺你的话的,他不会新建一个你设定的窗口打开,而是在一个新的标签页打开。

  这个,你就认了吧!如果不服气,你可以用下面的函数来解决。

 

showModalDialog

  试了下,chrome、FF、IE下都能跳出一个模态框口出来。

window.showModalDialog("","","dialogHeight=200,dialogWidth=300");

  注意:这里的第三个参数有一些不同,加了个前缀dialog。

  不过搜狗又有点变态了,

  1. 如果你的第一个参数不写,即为空时,弹不出来。

  2. 如果第一个参数的URL地址和window.location不是同一个域内(什么是同域),则会这样:

  会弹出一个存在安全隐患的提示,这个也是个烦人的东西,修改IE的安全项应该可以解决问题。这里不多说。

 

window.close

  这个不用说,大家问题遇到最多的就是这个东西的bug。

window.close()

  如果单单是这一句话,IE(搜狗等)会弹出这么一个提示:

  

  FF和chrome无反应。如果加点东西:

//第一步,如果该窗口是被他爸爸打开的,先断绝父子关系
window.opener = null; 
//window.close()只允许关系自己打开的窗口
//用一个空页面替换掉现在的页面
var a = window.open("", "_self");
//然后关闭自己打开的页面
a.close();

  效果还行,把chrome的页面给关闭了,IE的弹出框也没了,不过可恶的FF依然没有反应!!!抓狂!!!!

 

干掉FireFox

  我们退而求其次,既然关不掉你,我就把你换成一个空页面算了!

window.location.href="about:blank";

  之所以window.close在firefox不能使用,是因为firefox默认不能关闭用户打开的网页。知道原因有个毛用,还是没办法把他kill掉。。。

 

  有人说:

我们可以这样设置firefox:
  打开firefox,在地址栏输入about:config
  找到dom.allow_scripts_to_close_windows这项并改为true。

  这样就可以解决Firefox的问题了,但是,难道你打算让用户这么去干?

 

不过还是恳请大神们找一个完美解决window.close的方案,坐等!!!

提供测试代码,省得你再打一次~

<!DOCTYPE HTML>  
<html>  
<head>  
    <meta charset="UTF-8">  
    <title>测试</title>
    <script type="text/javascript">
    //<![[
        function a(){
            //window.opener = null
            var b = window.open("","asdfs","width=300,height=400");
            //window.showModalDialog("http://www.baidu.com","","dialogHeight=200,dialogWidth=300");
            b.location.href = "./jQueryDemo.html";
            //alert(a.name)
            b.opener.getElmentById("i").focus();
            //window.close();
            //第一步,如果该窗口是被他爸爸打开的,先断绝父子关系
            //window.opener = null; 
            //window.close()只允许关系自己打开的窗口
            //用一个空页面替换掉现在的页面
            //var a = window.open("", "_self");
            //然后关闭自己打开的页面
            //a.close();
        }
    //]]>
    </script>
</head>  

<body>  
    <ul onclick="a()">
        <li>11111</li>
        <li>22222</li>
        <li>33333</li>
        <li>44444</li>
    </ul>
    <input type="text" id="i" />
</body>  
</html>