Javascript is divided into mode dialog boxes and non-mode dialog boxes. 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. You can only perform other operations on the program that opens the dialog box, but not the mode dialog box.
Mode dialog: showModalDialog
Non-mode dialog: showModelessDialog
vReturnValue = window.showModalDialog(sURL [, vArguments] [,sFeatures])
vReturnValue = window.showModelessDialog(sURL [, vArguments] [,sFeatures])
Return value: vReturnValue, which is of course the return value returned by the dialog box;
sURL: Required, for the page you want to open;
vArguments--
Optional parameter, type: variant. Used to pass parameters to the dialog box. The passed parameter types are not limited, including arrays, etc. The dialog box uses window.dialogArguments to obtain the passed parameters.
sFeatures--
Optional parameter, type: string. Information used to describe the appearance of a dialog box, such as the following information, can be separated by a semicolon ";".
1.dialogHeight: The height of the dialog box is not less than 100px. The default units of dialogHeight and dialogWidth in IE4 are em, and px in IE5 are px. For the sake of convenience, when defining the dialog box in the modal method, px is used as the unit.
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 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 is yes.
7.resizable: {yes | no | 1 | 0 } [IE5+]: Whether the size can be changed. Default no.
8.status: {yes | no | 1 | 0 } [IE5+]: Whether to display the status bar. Default is yes[Modeless] or no[Modal].
9.scroll:{ yes | no | 1 | 0 | on | off }: Indicates whether the dialog box displays scroll bars. Default is yes.
The following attributes are used in HTA and are generally not used in general web pages.
10.dialogHide:{ yes | no | 1 | 0 | on | off }: Whether the dialog box is hidden when printing or printing preview. Default is no.
11.edge:{ sunken | raised }: Specify the border style of the dialog box. The default is raised.
12.unadorned:{ yes | no | 1 | 0 | on | off }: Default is no.
Parameter passing:
1. If you want to pass parameters in the dialog box, it is passed through vArguments. There is no restriction on type, for string types, the maximum 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 pass is: " + obj.name) </script>-------------------------------
2. You can return information to the window where the dialog box is opened through window.returnValue, and of course 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>
After using window.showModalDialog or window.showModelessDialog to open a mode window, some interaction problems with the parent window.
For interactive operation, when calling the showModalDialog or showModelessDialog method, the second parameter is passed to the window, such as:
window.showModelessDialog('filename.htm',window,'dialogWidth=200px;dialogHeight=250px;')
Next, it is to obtain some data and methods of the parent window. This is often used. The parameters of the parent window that take child windows can generally be handled by returnValue.
//Get the JS variable var window.dialogArguments.var of the parent window; //Get the object and attributes of the parent window window.dialogArguments.form1.name.value; //Call the parent window's method funwinwindow.dialogArguments.fun();