Javascript中window.opener的一点小总结

以前一直认为window.opener只有在window.open方法打开下的窗口才可以访问,没想到即使是a链接打开的页面的照样可以访问。window.opener指向父窗口,也就是来源窗口。可以利用window.opener获取来源页面location.href信息等,也可以操作来源 页面的DOM,十分强大

但下面的情况,window.opener的值为null

1,跨域的情况
如果是www.a.com/1.html链接到www.b.com/2.html,这种情况会丢失
2,利用的javascript对location的操作
比如1.html页面是通过location.href=”2.html”跳转到2.html的,在2.html的window.opener也是null,无法获取
3,利用浏览器的拖拽功能
现在的浏览器基本都是支持多tab浏览了,如果是利用拖拽链接的tab,在新tab的网页中也是无法获取window.opener

在JS中,window.opener只是对弹出窗口的母窗口的一个引用。比如:
a.html中,通过点击按钮等方式window.open出一个新的窗口b.html。那么在b.html中,就可以通过window.opener(省略写为opener)来引用a.html,包括a.html的document等对象,操作a.html的内容。
假如这个引用失败,那么将返回null。所以在调用opener的对象前,要先判断对象是否为null,否则会出现“对象为空或者不存在”的JS错误。
 
例子
--------------------------------
opener.html
--------------------------------

 代码如下 复制代码
<html>
<body>
<form name=form1>
<input type=text name=inpu >
<input type=button  onclick="javascript:window.open('back2opener.html?toname=opener.form1.inpu');">
</form>
</body>
</html>

 
--------------------------------
back2opener.html
--------------------------------

 代码如下 复制代码

<html>
<body>
<form name=form1>
<input type=text name=inpu >

  <a class=under href=# onclick="{opener.document.form1.inpu.value+='孙超,';}">添加</a>
</form>
</body>
</html>

JS代码:

 代码如下 复制代码

window.open();

而当支付成功后,需要关闭支付平台支付成功界面,并在客户端加载客户端支付成功页面,JS代码:
window.opener.location.href=url;window.close(); 

补充一下关于window.opener与js window.parent差异

window.parent和window.opener区别来讲的,我们如果要用到iframe的值传到另一框架就要用到 :

 代码如下 复制代码
window.opener.document.getElementById(name).value = uvalue;

这种形式哦。

window.parent能获取一个框架的父窗口或父框架。顶层窗口的parent引用的是它本身。
 
可以用这一点特性来判断这个窗口是否是顶层窗口。如:

 代码如下 复制代码

function IsTopWindow( win )
{
    if( win.parent == win ) return true;
    else return false;
}

window.opener引用的是window.open打开的页面的父页面。

opener即谁打开我的,比如A页面利用window.open弹出了B页面窗口,那么A页面所在窗口就是B页面的opener,在B页面通过opener对象可以访问A页面。

parent表示父窗口,比如一个A页面利用iframe或frame调用B页面,那么A页面所在窗口就是B页面的parent。

在JS中,window.opener只是对弹出窗口的母窗口的一个引用。比如:
a.html中,通过点击按钮等方式window.open出一个新的窗口b.html。那么在b.html中,就可以通过 window.opener(省略写为opener)来引用a.html,包括a.html的document等对象,操作a.html的内容。假如这个引用失败,那么将返回null。所以在调用opener的对象前,要先判断对象是否为null,否则会出现“对象为空或者不存在”的JS错误。
 
window.opener 返回的是创建当前窗口的那个窗口的引用,比如点击了a.htm上的一个链接而打开了b.htm,然后我们打算在b.htm上输入一个值然后赋予a.htm上的一个id为“name”的textbox中,就可以写为:

 代码如下 复制代码

window.opener.document.getElementById("name").value = "输入的数据";

时间: 2024-09-22 16:38:03

Javascript中window.opener的一点小总结的相关文章

JavaScript中window.open用法实例详解_javascript技巧

本文较为详细的分析了JavaScript中window.open用法.分享给大家供大家参考.具体如下: 复制代码 代码如下: <script LANGUAGE="javascript"> window.open ('page.html', 'newwindow', 'height=100, width=400, top=0, left=0, toolbar=no, menubar=no, scrollbars=no,resizable=no,location=no, sta

重写javascript中window.confirm的行为_javascript技巧

javascript中window.confirm这个方法很好用,可以弹出一个确认对话框我们之所以弹出这个对话框,可能就是因为该操作很危险,所以要用户确认.但如果默认选择"确定",则可能违背了这个原则. 另外,confirm对话框的按钮都是固定在"确定"和"取消"这两个.可能有些时候也不是很直观. 所以,可以考虑用vbscript中的msgbox来改写这个行为.下面是一个范例 复制代码 代码如下: <%@ Page Language=&qu

JavaScript中window对象属性,时间等的总结

Window对象是客户端javascript最高层对象之一,只要打开浏览器窗口,不管该窗口中是否有打开的网页,当遇到BODY.FRAMESET或 FRAME元素时,都会自动建立window对象的实例.另外,该对象的实例也可由window.open()方法创建.由于window对象是其它大部分对象的共同祖先,在调用window对象的方法和属性时,可以省略window对象的引用.例如:window.document.write()可以简写成: document.write(). 在窗口中觖发本窗口对

js中window.opener方法的跨域问题分析

最近公司网站登陆加入了第三方登陆.可以用QQ直接登陆到我们网站,在login页面A中点QQ登陆时,调用了一个window.open文件打开一个login页窗口B,登陆后callback地址回调成功后,需要关闭当前window.open打开的login小窗口B,再将打开这个小窗口的原窗口页(A)刷新显示正确状态. 这时就用到了这个方法: window.opener.location.reload() 与 window.opener.location.href=window.opener.locat

JavaScript中Window对象简明学习

1.Window对象是所有客户端JavaScript特性和API的主要接入点. Window对象中的一个重要属性是document,它引用Document对象.JavaScript程序可以通过Document对象和它包含的Element对象遍历和管理文档. 2.URL中的JavaScript 在URL后面跟一个JavaScript:协议限定符.里面的代码会作为JavaScript代码进行运行,需用分号分割.如: <a href="javascript:alert('OK!')"&

Javascript中window.open和window.close的使用方法

有时候,我们想通过JS实现一个<a>的新开标签的效果,此时我们想到了window.open方法实现.那么window.open到底应该怎么使用呢? 我们知道window.open可以新开窗口或标签页(这通常和浏览器的设置选项有关),载入指定的URL到新的或已存在的窗口中,并返回代表那个窗口的window对象.window.close可以关闭窗口,但是只能自动关闭JS打开的窗口,如果要关闭其他窗口,必须提示用户进行确定或取消操作(这个与浏览器相关,经测IE需要提示才能关闭:其他浏览器不允许自动关

javascript中关于&amp;&amp; 和 || 表达式的小技巧分享_javascript技巧

如果你还是新手, 而且读完所有这些技巧的详解和每种技巧是如果工作的以后运用它们, 你会写出更加简练高效的JavaScript程序. 确实, JavaScript高手已经运用这些技巧写出了很多强大, 高效的JavaScript程序. 但是你可以这样. 强大的 && 和 || 表达式 你可能在JavaScript库和JavaScript框架中已经见过它们了, 那么我们先由几个基本的例子开始: 例子1. || (或) 设置默认值, 通常用 复制代码 代码如下: function document

javascript中window.event事件用法详解_基础知识

前两天写程序时因为要用到javascript中的window.event事件,于是就在网上搜了一下,终于找到一篇不错的文章,来与大家分享下: 描述 event代表事件的状态,例如触发event对象的元素.鼠标的位置及状态.按下的键等等. event对象只在事件发生的过程中才有效. event的某些属性只对特定的事件有意义.比如,fromElement 和 toElement 属性只对 onmouseover 和 onmouseout 事件有意义. 例子下面的例子检查鼠标是否在链接上单击,并且,如

JavaScript中使用正则表达式的一点笔记

前几天在空隙时间在读Mastering Regular Expressions这本书.不愧是关于正则表达式的一本好书,我也应该买一本的.现在是暂时借了阿威买的第三版的中文版来读.中文版翻译得还不错.有不少地方感觉翻译得挺精彩的,虽然马上就能猜到原文是怎么写的,但读起来中文一点都不觉得拗口. 现在才读到第76页,第二章,比较入门的部分.以前也不是没用过正则表达式,不过一边读这书一边就觉得以前真的中了很多陷阱.而且我居然一直不知道正则表达式里面有lookaround(positive/negativ