Home > Developer > JavaScript
Previously thought that Window.opener only in the Window.Open method opened the window can be accessed, did not expect even a link opened the same page can be accessed. Window.opener points to the parent window, which is the source window. can use Window.opener to get source page location.href information, etc., can also manipulate the source page of the DOM, very powerful
But in the following case, the value of Window.opener is null
1, cross-domain situation
If it is www.a.com/1.html link to www.b.com/2.html, this situation will be lost
2, the use of JavaScript on the location operation
For example 1.html page is through location.href= "2.html" Jump to 2.html, in 2.html of Window.opener is also null, unable to get
3, using the browser's Drag and drop function
Now the browser is basically supporting multiple tab browsing, if the use of drag-and-Drop link tab, in the New tab page is also unable to get Window.opener
In JS, Window.opener is just a reference to the pop-up window's parent window. Like what:
In A.html, window.open a new window b.html by clicking on a button. Then in b.html, we can use Window.opener (omit write as opener) to reference a.html, including a.html document and other objects, manipulate a.html content.
If this reference fails, then NULL is returned. Therefore, before calling the opener object, you must first determine whether the object is null, otherwise the "object is empty or does not exist" JS error.
Example
--------------------------------
Opener.html
--------------------------------
| The code is as follows | Copy Code |
| <body> <form name=form1> <input Type=text Name=inpu > <input Type=button onclick= "Javascript:window.open (' Back2opener.html?toname=opener.form1.inpu ');" > </form> </body> |
|
--------------------------------
Back2opener.html
--------------------------------
| The code is as follows | Copy Code |
<body> <a class=under href=# onclick= "{opener.document.form1.inpu.value+= ' Sun Chao, ';}" > Add </a> |
|
JS Code:
| The code is as follows | Copy Code |
window.open (); |
|
And when payment is successful, the payment platform needs to be closed to the successful interface, and the client loads the client to pay the Success page, JS code:
Window.opener.location.href=url;window.close ();
Add the difference between Window.opener and JS Window.parent
Window.parent and Window.opener, if we were to use the value of an IFRAME to another frame, we would use:
| The code is as follows | Copy Code |
| Window.opener.document.getElementById (name). value = Uvalue; |
|
This form OH.
Window.parent can get a frame's parent window or parent frame. The parent of the top-level window refers to itself.
You can use this feature to determine whether the window is a top-level window. Such as:
| The code is as follows | Copy Code |
function Istopwindow (Win) |
|
Window.opener refers to the parent page of the window.open open page.
Opener that who opened my, such as a page using window.open pop-up b page window, then a page is the window is the B page opener, the B page through the opener object can access a page.
Parent represents the parents window, such as a page with an IFRAME or frame to invoke B page, then page A is the parent of page B.
In JS, Window.opener is just a reference to the pop-up window's parent window. Like what:
In A.html, window.open a new window b.html by clicking on a button. Then in b.html, we can use Window.opener (omit write as opener) to reference a.html, including a.html document and other objects, manipulate a.html content. If this reference fails, then NULL is returned. Therefore, before calling the opener object, you must first determine whether the object is null, otherwise the "object is empty or does not exist" JS error.
Window.opener returns a reference to the window that created the current window, such as clicking a link on the a.htm and opening the b.htm, and then we're going to enter a value on the b.htm and give it a TextBox with ID "name" on the a.htm. It can be written as:
| The code is as follows | Copy Code |
Window.opener.document.getElementById ("name"). Value = "entered data"; |
|
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
