Introduction to js mode window (mode dialog box and non-mode dialog box) _ basic knowledge-js tutorial

In Javascript, the mode separation dialog box and the non-mode dialog box are displayed. The following describes the usage of the two. In Javascript, the mode separation dialog box and the non-mode dialog box are displayed, in fact, the difference between the two is whether the user can work elsewhere on the same page before the dialog box is closed. For example, the "open file" dialog box is a typical mode dialog box. Only when you make an action on this dialog box can you perform other operations on the program that opens the dialog box, rather than the mode dialog box.

Mode dialog box: showModalDialog
Non-mode dialog box: showModelessDialog

VReturnValue = window. showModalDialog (sURL [, vArguments] [, sFeatures])
VReturnValue = window. showModelessDialog (sURL [, vArguments] [, sFeatures])

Returned value: vReturnValue, Which is returned by the dialog box;
SURL: (required) page to be opened;

VArguments --

Optional parameter; Type: variant. Used to pass parameters to the dialog box. The passed parameter types are not limited, including arrays. The dialog box uses window. dialogArguments to obtain the passed parameters.
SFeatures --
Optional parameter; Type: String. Used to describe the appearance and other information of the dialog box. You can use one or more of the following, separated by semicolons.
1. dialogHeight: the dialog box height. The default unit of dialogHeight and dialogWidth in IE4 is em, while that in IE5 is px. For convenience, when defining the modal mode dialog box, unit with px.
2. dialogWidth: Dialog Box width.
3. dialogLeft: the distance from the left of the screen.
4. dialogTop: the distance from the screen.
5. center: {yes | no | 1 | 0}: whether the window is centered. The default value is yes, but the height and width can still be specified.
6. help: {yes | no | 1 | 0}: whether to display the help button. The default value is yes.
7. resizable: {yes | no | 1 | 0} [IE5 +]: whether the size can be changed. No by default.
8. status: {yes | no | 1 | 0} [IE5 +]: whether to display the status bar. The default value is yes [Modeless] or no [Modal].
9. scroll: {yes | no | 1 | 0 | on | off}: Specifies whether the scroll bar is displayed in the dialog box. The default value is yes.
The following attributes are used in HTA and are not used in general web pages.
10. dialogHide: {yes | no | 1 | 0 | on | off}: whether the dialog box is hidden when printing or previewing. The default value is no.
11. edge: {sunken | raised}: Specify the border style of the dialog box. The default value is raised.
12. unadorned: {yes | no | 1 | 0 | on | off}: no by default.

Parameter transfer:

1. vArguments is used to pass Parameters in the dialog box. The type is not limited. For string types, the maximum value is 4096 characters. Objects can also be passed, for example:
-------------------------------
Parent.htm

《script》 var obj = new Object(); obj.name="51js"; window.showModalDialog("modal.htm",obj,"dialogWidth=200px;dialogHeight=100px"); 《script》

Modal.htm

Script var obj = window. dialogArguments alert ("the parameter you passed is:" + obj. name) script

-------------------------------
2. You can use window. returnValue to return information to the window that opens the dialog box. It can also be an object. For example:
------------------------------
Parent.htm

《script》 str =window.showModalDialog("modal.htm",,"dialogWidth=200px;dialogHeight=100px"); alert(str); 《script》

Modal.htm

《script》 window.returnValue="http://www.51js.com"; 《script》

Use window. showModalDialog or window. showModelessDialog to open a mode window and interact with the parent window.
To perform interactive operations, when you call the showModalDialog or showModelessDialog method, pass the second parameter to window, for example:
Required parameter showmodelessdialog('filename.htm', window, 'dialogwidth = 200px; dialogHeight = 250px ;')
The next step is to obtain some data and methods of the parent window, which is often used. The parameters of the Child Window of the parent window can be done through returnValue.

// Obtain the JS variable var window of the parent window. dialogArguments. var; // obtain the object and attribute window of the parent window. dialogArguments. form1.name. value; // call the funwindow method of the parent window. dialogArguments. fun ();