Analyze web pages and the parent window, child window interaction

2010-10-11  来源:本站原创  分类:Web  人气:184 

1, the parent window to pass information to the child window

Look at the code example:

<script language=javascript>

function outPut ()
... {
/ / Get the parent window's text message assigned to the text
var text = document.abc.text.value;
/ / Open child window, and the operating handle to the variable assigned to win, win for all of the following operations are the object
var win = window.open (""," mywin "," menubar = no, width = 400, height = 100, resizeable = yes ");
/ / Output basic information
win.document.writeln ("<title> output </ title>");
win.document.writeln ("Your message is: <p>");
/ / Output the information obtained from the parent window
win.document.writeln (text);
win.document.close ();
win.focus ();
}
</ Script>

<form name=abc method=post>
<input type=text name=text size=50>
/ / Call the above function
<input type=button value= Submit >

</ Form>

2, the child window to pass parameters to the parent window

We transform the code above:

<script language=javascript>

function outPut ()
... {
var text = document.abc.text.value;
var win = window.open (""," mywin "," menubar = no, width = 400, height = 100, resizeable = yes ");
win.document.writeln ("<title> output </ title>");
win.document.writeln ("Your message is: <p>");
win.document.writeln (text);
win.document.writeln ("<input type=text name=child value= Child window information >");

/ / Operation pair window itself, the use of self object, operational use of the parent opener window object, which is the key
/ / Handle window form values back to the parent window, replacing the previous value of the parent window form, then close the child window
win.document.writeln ("<input type=button value= Turn off your >");
/ / Close the parent window can be controlled
win.document.writeln ("<input type=button value= Close the parent window >");
/ / Refresh the parent window
win.document.writeln ("<input type=button value= Refresh parent window >");

win.document.close ();
win.focus ();
}
</ Script>

<form name=abc method=post>
<input type=text name=text size=50>
<input type=button value= Submit >
</ Form>

3, not the same page interact with the child window and parent window

Suppose we relate to external programs, such as php, asp, etc., then we may be dealing with two pages, for example, uploading, we just need to open a new page and then make a new page in the value passed to the parent page .
Local code example:

<input type="input" value="" name="input_tag" id = "input_tag" onKeyUp="clearPreTagStyle()" size="40">
<input type="hidden" value="0" name="tagid">
<input type="button" value=" Tag ">

These are part of the parent window code is encapsulated inside the popUpWindow window.open function, so to understand things to the tag.php is another page on the can, we need the current values in the form submitted to the tag.php page to deal with.
tag.php part of the code:

Enquiries tag results:

<a href="#" name="tag_1"> life </ a> <a href="#"> to join the label </ a>

<a href="#" name="tag_2"> Life Show </ a> <a href="#"> to join the label </ a>

This is our child window, we should tag_1 and tag_2 return to the child window, although they are not the same page. Here is a knowledge point, that is, how do we get the value of connection, we use the innerHTML property: document.tag_2.innerHTML this is the value we obtained tag_2 "Life Show", we can also use other methods to obtain, such as: document. all.tag_2.innerHTML, or this.innerHTML link refers to the value of their own.

Access to use the opener object is the parent window handle: opener.document.tryst_form.input_tag.value, to be able to change the value of the parent window.

相关文章