今天再次谈起window.open是因为发现了一个比较好玩的小技巧，详细内容我们稍后详细说明。
 
    聊到window.open，不得不说明一下他的使用方法，主要有两种形式：
 
  • window.open()没有任何参数，这种方式可以新标签打开页面
  • window.open(url, name, pars)，带有参数的可以在当前页面打开窗口
 
    详细的使用方法，之前有过介绍，如果想了解，可以点击这里。
 
    知道了如何使用，接下来介绍几个特别的属性和方法（下面所说到的都是同域页面）：
 
  1. window.open()打开的窗口或者新标签返回窗口的window对象
  2. 在新窗口里也可以取到父窗口（执行window.open的环境）的window对象，通过window.opner
  3. window.close()方法可以关闭窗口
  4. window.onunload和window.onbeforeunload事件，监听窗口关闭情况
 
    了解了上面的使用方法之后，介绍一个很巧妙的使用方式。
 
    一共有两个页面：第一个页面(window.open.html)的功能是新开一个窗口，第二个页面(window.close.html)为新开窗口的请求的返回信息，可以在第一个页面中，监听新开窗口请求的数据。下面分别介绍两个页面：
 
    window.open.html页面内容如下：
 
<!DOCTYPE>

<html>

<head>

	<meta charset="utf-8">

	<title>window.open小技巧</title>

</head>

<body>

我是窗口：window.open

<button id="openWindow">点击新开窗口</button>

<script type="text/javascript">

(function() {

	var openWindowEl = document.getElementById('openWindow');

    var newWindow;

    var data;

    window.windowName = 'window.open';

	openWindowEl.onclick = function() {

        newWindow = window.open('window.close.php', '_blank', 'width=500,height=500;');

        //需要window.close.html js正常执行之后才行

        /*setTimeout(function() {

        	console.log(newWindow.userName);

        }, 1000);*/

    	newWindow.onbeforeunload = function() {

            userName = newWindow.windowName;

            data = newWindow.data;

        }

        newWindow.onunload = function() {

            alert(userName);

            if(data.errno == 0) {

            	alert(data.errmsg);

            }else {

            	alert(data.errmsg);

            }

        }

    };

})();

</script>

</body>

</html>
   
　　window.close.html页面内容如下：

<!DOCTYPE>

<html>

<head>

	<meta charset="utf-8">

	<title>window新开窗口</title>

</head>

<body>

我是窗口：window.close

<script type="text/javascript">

(function() {

	window.windowName = 'window.close';

    if(Math.random() > 0.5) {

    	window.data = {

            errno: 0,

            errmsg: '成功~'

        };

    }else {

    	window.data = {

            errno: 1,

            errmsg: '数据异常~'

        };

    }

    setTimeout(function() {

        //拿到的是父窗口的window

    	alert(window.opener.windowName);

    }, 100);

    setTimeout(function() {

    	window.close();

    }, 1000);

})();

</script>

</body>

</html>
 
    通过上面介绍的这种方式可以解决，微博等第三方登录无刷新父页面得知返回状态的需求。同时也是解决跨域请求的一个比较好的方式（安全性不知道如何）。测试小例子
 
    今天就分享这么一个小技巧吧~

window.open的小技巧分享的更多相关文章

  1. window.open的小技巧分享（转）

    今天再次谈起window.open是因为发现了一个比较好玩的小技巧,详细内容我们稍后详细说明.       聊到window.open,不得不说明一下他的使用方法,主要有两种形式:   window. ...

  2. Python编码小技巧分享【新手必学】

       本次分享了python编程小技巧总结如下,希望对大家有帮助,非常实用哦注意:很多人学Python过程中会遇到各种烦恼问题,没有人帮答疑.为此小编建了个Python全栈免费答疑交流.裙 :一久武其 ...

  3. javascript中关于&& 和 || 表达式的小技巧分享

    如果你还是新手, 而且读完所有这些技巧的详解和每种技巧是如果工作的以后运用它们, 你会写出更加简练高效的JavaScript程序. 确实, JavaScript高手已经运用这些技巧写出了很多强大, 高 ...

  4. Visual Studio模板代码注释小技巧分享

    在日常开发过程中,难免有这样一种需求:就是你所建的每一个类文件或者接口文件都需要标注下作者姓名以及类的用途.如果我们每次创建文件的时候都需要写一遍这些信息是很烦神的.还好Visual Studio给我 ...

  5. Android Studio使用小技巧：提取方法代码片段

    http://www.jb51.net/article/65510.htm 今天来给大家介绍一个非常有用的Studio Tips,有些时候我们在一个方法内部写了过多的代码,然后想要把一些代码提取出来再 ...

  6. android浏览器开发小技巧集锦（转）

    本人和朋友们做了一段时间浏览器,将一些小技巧分享出来,先写一部分,慢慢写,同时也为我们的浏览器打打广告 我们的浏览器将要上线,名叫沙发浏览 1.网页内的右键菜单 public boolean onLo ...

  7. openinstall集成小技巧

    引言:最近在做一个iOS端的小游戏,想要实现在安装时自动关联好友的功能,就发帖询问有没有好的想法.在帖子中法想了这个不错的SDK,通过它我们还实现了,安装后自动进入好友游戏房间的功能.这里我就分享一下 ...

  8. 牛腩新闻公布系统--学习Web的小技巧汇总

    2014年11月10日,是个难忘的日子.这一天.小编的BS学习開始了.BS的开头,从牛腩新闻公布系统開始.之前学习的内容都是CS方面的知识,软考过后.開始学习BS,接触BS有几天的时间了,跟着牛腩老师 ...

  9. 牛腩新闻发布系统--学习Web的小技巧汇总

    2014年11月10日,是个难忘的日子,这一天,小编的BS学习开始了,BS的开头,从牛腩新闻发布系统开始,之前学习的内容都是CS方面的知识,软考过后,开始学习BS,接触BS有几天的时间了,跟着牛腩老师 ...

随机推荐

  1. 拿到手机ip住址

    转载自:http://blog.csdn.net/showhilllee/article/details/8746114 貌似ASI里获取ip地址的链接不能够了.也曾试过whatismyip,在其站点 ...

  2. android 使用String.format("%.2f",67.876)自已定义语言（俄语、西班牙语）会把小数点变为逗号

    市场人员反映公司的app使用系统设置俄语.西班牙语,double数据会把小数点变为逗号.调试一下,是自定义的语言时候(例如,俄语.西班牙语)转换String.format("%.2f&quo ...

  3. Facebook的手游出海之道

    对于不同的游戏公司,面临的同一个问题就是怎样让海外玩家能够一眼在App中发现你,成为你的新用户:不仅如此,怎样留住这些用户,让他们成为你游戏的忠实玩家也是让全部游戏开发商困扰的一个问题. w=580& ...

  4. Android 百度地图 SDK v3.0.0 （一）

    转载请标明出处:http://blog.csdn.net/lmj623565791/article/details/37729091 最近公司要把百度地图集成的项目中,于是我就研究了一天百度地图的SD ...

  5. IPython notebook 使用介绍

    参考资料: http://mindonmind.github.io/2013/02/08/ipython-notebook-interactive-computing-new-era/ http:// ...

  6. codevs 3693 数三角形

    /* n*m个点中选3个 再排除三点共线 共线分两类 1 在横线或者竖线上 m*C(n,3) n*C(m,3) 2 在对角线上 这个比较麻烦 以为对角线和矩阵是一一对应的 我们转化成求矩阵 并且保证有 ...

  7. python的行与缩进

    #coding=utf-8#逻辑行与物理行#以下是3个物理行print "abc"print "789"print "777" #以下是1个 ...

  8. DNN模块开发之利器篇:七种武器

    我们在进行DNN模块开发时经常需要调用Dotnetnuke.dll中的方法函数,模块开发用到DNN的方法函数会让你的开发更加得心应手,下面我们就来介绍一下.   1) PortalModuleBase ...

  9. 工作中部署使用MP平台的一些问题

    1.首先先把项目导入到myeclipse中,如果没有.classpath和.mymetadata和.project等文件,就自己创建一个web项目,然后把里面的src覆盖,webroot等文件覆盖. ...

  10. C++拾遗（五）语句相关

    前缀格式与后缀格式 对于表达式:后缀如 i++ 表达式的值仍是 i,在遇到下一个顺序点后再将 i 加1.前缀 ++i 表达式的值就是(i+1),先计算表达式的值,不需要等待 顺序点. 对于类:前缀函数 ...