The method of assigning value to each other of JS child's parent window introduction _javascript skills

$ ("#父窗口元素ID", window.parent.document);

Corresponding JavaScript version is window.parent.document.getElementByIdx_x ("Parent window Element ID");

Takes the element method of the parent window: $ (selector, window.parent.document);
Then you can take the element of the parent window of the parent window to use: $ (selector, window.parent.parent.document);

Similarly, there are similar methods for taking other windows.
$ (selector, window.top.document);
$ (selector, window.opener.document);
$ (selector, window.top.frames[0].document);

--------------------------------------------------------------------------------------------------

child window creation and communication between parent window and child window:

1, JavaScript pop-up child window

Can be implemented in a variety of ways, here are a few ways

(1) by using the open () method of the Window object, the open () method will produce a new Window object

Its usage is:
window.open (url,windowname,parameters);

URL: Describes the URL of the window to open, and how to empty it without opening any web page;

Windowname: Description of the opened window of the people said, you can use ' _top ', ' _blank ' and other built-in names, where the name and <a href= "..." target= "..." the target attribute in > is the same.

Parameters: Describes the parameter values of the window being opened, or the appearance, which includes the values of each property of the window, and the parameter values to pass in.

For example:

Open a clean window of x 100:
Open (', ' _blank ', ' width=400,height=100,menubar=no,toolbar=no,
Location=no,directories=no,status=no,scrollbars=yes,resizable=yes ')

You can also write this: var newwindow = open (', ' _blank ');

The parameter description is as follows:

The number of pixels off the top of the screen at the top of the top=# window
left=# window left the number of pixels leaving the left side of the screen
Width of the width=# window
Height of the height=# window
Menubar= ... Window has no menu, value Yes or no
Toolbar= ... Window has toolbar, value Yes or no
Location= ... window has no address bar, value yes or no
Directories= ... window has no connection area, value Yes or no
Scrollbars= ... Window has scroll bar, value Yes or no
Status= ... Window has status bar, value Yes or no
Resizable= ... window is not resized, value yes or no

(2) in JavaScript, in addition to the open () method to create a Window object implementation pop-up, you can create a dialog box pop-up window.
Such as:
Alert (""); Pop-up Message prompt dialog box
Confirm (""); Pop-up Message Confirmation dialog box
Prompt (""); dialog box with an interactive nature

However, the above implementation of the pop-up window has a single function, can only complete a relatively simple function. For the need to display multiple data information in a dialog box,

Even HTML controls are powerless.

(3) using modal dialogs to implement complex dialog box requirements
There is also a way in which JavaScript's built-in methods can be used to display HTML content through a dialog box,
That is, you can do what you can to create a window object by creating a dialog box.
This includes creating modal dialog boxes and modeless dialog boxes.

The implementation method is:

Create modal you dialog box
window.showModalDialog (Surl,varguments,sfeatures)

To create a modeless dialog box
Window.showmodelessdialog (Surl,varguments,sfeatures)

The difference is:

When you open a window with showModelessDialog (), you do not have to use Window.close () to turn it off, open the dialog box when it is not modal [IE5]

Window can still do other things, that is, the dialog box is not always the top focus, and when the URL of the window to open it changes, it automatically closes. The modal [IE4] mode dialog box always has the focus (the focus cannot be moved until it closes). The modal dialog box is associated with the window that opens it, so when we open another window, their link relationship is still saved and hidden underneath the active window. Showmodedialog () is not.

Parameter description:

sURL: Required parameter, type: String.

The URL used to specify the document to display in the dialog box.

Varguments: Optional parameter, type: Variant.

Used to pass parameters to the dialog box. The parameter types passed are not limited, including arrays, and so on. The dialog box is window.dialogarguments to get the parameters passed in.

Sfeatures: Select parameter, type: String.

Used to describe information such as the appearance of a dialog box, you can use one or more of the following, with a semicolon ";" Separated.

Dialogheight: Dialog box height

Not less than 100px,ie4 in dialogheight and dialogwidth the default unit is EM, and IE5 is PX, in order to facilitate its see, in the Definition of modal dialog box, with PX to do units.

Dialogwidth: Dialog box width.

Dialogleft: The distance from the left of the desktop.

Dialogtop: The distance from the desktop.

Center: Whether the window is centered

The default yes, but you can still specify the height and width, the value range {yes | no | 1 | 0}.

Help: Do you want to show the assistance button

Default Yes, value range {yes | no | 1 | 0}.

Resizable: can be changed to size.

Default No, value range {yes | no | 1 | 0} [ie5+].

Status: Whether the status bar is displayed.

Default is yes[Modeless] or no[modal],

Value Range {Yes | no | 1 | 0} [ie5+].

Scroll: Indicates whether the dialog box displays scroll bars.

The default is yes, the value range {yes | no | 1 | 0 | on | off}.

There are several attributes that are used in an HTA and are generally not used in general Web pages.

Dialoghide: Dialog box is hidden when printing or printing preview.

Default is no, value range {yes | no | 1 | 0 | on | off}.

Edge: Indicates the border style of the dialog box.

Default is raised, value range {Sunken | raised}.

Unadorned: Default is no, value range {yes | no | 1 | 0 | on | off}.

Incoming parameters:

To pass arguments to the dialog box, it is passed through the varguments. Type is not restricted, for a string type, the maximum is 4,096 characters. You can also pass objects

For example:

var newwin=window.showmodaldialog (Url,window, ' dialogheight:500px, dialogleft:100px, dialogtop:100px,

dialogwidth:300px, status:0, Edge:sunken ');

Newwin.open ();

Instead of creating a window using the window.open () method, the modal method creates a window that is not able to manipulate the parent window after a window created by the modal method.

2. Communication between child window and parent window

(1) using window.open () to create a window to communicate with the parent window
You can get the parent window object by Window.opener in the child window page, and then the child window can perform the refresh, value, and so on for the parent window.
Such as:
Window.opener.location.reload (); child window refreshes parent window
Window.opener.location.href//Get parent window href
Window.opener.locaiton.pathname//Get the parent window path name

Refreshing the parent page
Window.location.href=window.location.href; Relocate parent page
Window.location.reload;

(2) modal window communicates with parent window
A child window created by using Showmodeldialog () and the showModelessDialog () method cannot be passed through Window.opener when it wants to communicate with the parent window

To get the parent window object. To implement communication, you must pass in the parent window object to a child window when you create a modal child window.

Implemented in the following ways:

In the parent window:

var newwin=window.showmodeldialog (Url,window, "");
Newwin.open ();

The parameter window is the parent window object at this time

In the child window:

You need to get the parent window object first before you can use the parent window object. Because the parent window object is creating a
Child window is passed in as a parameter, so the parent window object can only be obtained in a child window by getting the window parameter. Get the following way:

var parent=widnow.dialogarguments;
Variable parent is the parent window object.

For example:

To submit a form in the parent window through a child window: Form1, perform a query operation after committing
var parent=window.dialogarguments;
Parent.document.form1.action= "queryinfor.jsp";
Parent.submit ();

Refreshing the parent page
var parent=window.dialogarguments;
Parent.location.reload ();

To pass a value from a child window to a parent window
To implement a pass value to the parent window in a modal child window, you need to use Window.returnvalue to complete

The implementation method is as follows:

In the child window:

Gets the value of a field in the parent window, adds one to the value, and returns the parent window
var parent=window.dialogarguments;
var X=parent.docuement.getelementbyid ("Age"). Value;
x=x+1;

return x Value
Window.returnvalue=x;

In the parent window:

To get values from child windows
var newwin=window.showmodeldialog (Url,window, "");
if (newwin!=null)
Document.getelementbyidx_x ("Age"). Value=newwin;

To set the value of a parent window in a child window
Passing values to the parent window in a child window does not seem to be straightforward to set the value in the parent window. It is more flexible to set the value of the element directly in the parent window. However, the specific approach to use depends on the actual situation and the existing implementation, because if the use of unrealistic methods not only reduce development efficiency, but also reduce the efficiency of execution, often resulting in an elegant way of implementation and code style.

The child window sets the value of the parent window using the following method:

child window:

var parent=window.dialogarguments;
var x=parent.document.getelementbyidx_x ("Age"). Value;
x=x+1;
Set the Age property value in the parent window
Parent.document.getElementByIdx_x ("Age"). Value=x;

These are some of the methods and data that I collect and accumulate when I use JavaScript in my project to solve child window problems. I do this by using a modal window (which is mostly related to the project itself), but in fact there are significant differences in implementation, whether using window.open () or using Window.showmodeldialog () for parameters, First contact will feel a bit messy, but as long as the relationship between the child window and the parent window and the role, it is very good to understand.