JavaScript window.showModalDialog of

  • 2020-05-07 19:10:49
  • OfStack

Today, I used the popup subwindow in the project, so I thought of two methods to implement with JavaScript, one is window.open (); One is the window.showModalDialog () method, which is a popup window with a parent-child relationship. The parent window is activated only when the child window is closed, and parameters and return values can be passed. Just review the usage once more, and by the way, record the problems encountered in the process.

Basic introduction:
showModalDialog() (IE 4+ support)
showModelessDialog() (IE 5+ support)
The window.showModalDialog () method is used to create a modal dialog box that displays the HTML content.
The window.showModelessDialog () method is used to create a modeless dialog box that displays the HTML content.

Usage:
vReturnValue = window.showModalDialog(sURL [, vArguments] [,sFeatures],"");
vReturnValue = window.showModelessDialog(sURL [, vArguments] [,sFeatures],"");

Parameter description:
sURL:
Required parameter, type: string. URL to specify the document to be displayed in the dialog box.
vArguments:

Optional parameter, type: variant. Used to pass parameters to the dialog box. There is no limit to the types of arguments you can pass, including arrays, etc. The dialog box gets the parameters passed by window.dialogArguments.
sFeatures:

Optional parameter, type: string. Used to describe the appearance of the dialog box and other information, you can use one or more of the following, with a semicolon ";" Separated.

1.dialogHeight: the height of the dialog box is not less than 100px. The default unit of dialogHeight and dialogWidth in IE4 is em, while IE5 is px.
dialogWidth: width of dialog box.
dialogLeft: distance to the left of the screen.
4.dialogTop: distance from the screen.
5.center: {yes | no | 1 | 0} : whether the window is centered, yes is the default, but you can still specify the height and width.
6.help: {yes | no | 1 | 0} : whether to display the help button, yes is the default.
7.resizable: {yes | no | 1 | 0} [IE5+] : can the size be changed? The default no.
8.status: {yes | no | 1 | 0} [IE5+] : whether to display status bar. The default is yes[Modeless] or no[Modal].
9.scroll:{yes | no | 1 | 0 | on | off} : indicates whether the dialog box displays scrollbars. The default is yes.
The following properties are used in HTA and are not used in 1-like pages.
10.dialogHide:{yes | no | 1 | 0 | on | off} : whether the dialog box is hidden when printing or printing preview. The default is no.
11.edge:{sunken | raised} : specifies the border style of the dialog box. The default is raised.
12.unadorned:{yes | no | 1 | 0 | on | off} : no by default.

Parameter transfer:
1. To pass parameters to the dialog box, it is through vArguments. The type is unrestricted, with a maximum of 4096 characters for string types, and objects can also be passed.

2. Information can be returned to the window that opens the dialog box through window.returnValue, or it can be an object.


Related articles: