Js mode window of mode dialog box and non mode dialog box usage

  • 2020-03-30 03:34:27
  • OfStack

The difference between a modal dialog and a non-modal dialog in Javascript is whether the user can work elsewhere on the same page before the dialog is closed. For example, the "open file" dialog box is a typical mode dialog box. You can only open the dialog box by doing something about it.

Mode dialog: showModalDialog
Non-modal dialog box: showModelessDialog

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

Return value: vReturnValue, returned by the dialog box is of course the return value;
SURL: required, for the page you want to open;

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 arguments passed in through window.dialogarguments.
SFeatures -
Optional parameter, type: string. To describe the appearance of the dialog box, you can use one or more of the following, using the semicolon ";" Separated.
DialogHeight: dialogHeight, not less than 100px, the default unit of dialogHeight and dialogWidth in IE4 is em, and in IE5 is px, in order to facilitate the definition of modal mode dialog, use px as the unit.
2. DialogWidth:
DialogLeft: the distance to the left of the screen.
DialogTop: the distance from the screen.
5. Center: {yes | no | 1 | 0} : if 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, default yes.
7. Resizable: {yes | no | 1 | 0} [IE5+] : can the size be changed? No by default.
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} : The default is yes.
The following properties are used in HTA and are not used in normal web pages.
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} : specify the border style of the dialog box. The default is raised.
12. Unadorned: {yes | no | 1 | | 0 on | off} : the default value is no.

Parameter transfer:

1. To pass arguments to the dialog box, pass them through vArguments. Type is unrestricted, with a maximum of 4096 characters for string types. Objects can also be passed, for example:
-------------------------------
The 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 parameters you passed are: " + obj.name) 
</script>

  -------------------------------
2. Information can be returned to the window that opens the dialog box through window.returnvalue, or it can be an object. Such as:
------------------------------
The 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 Windows. ShowModalDialog or window. ShowModelessDialog after open a model window, and some of the parent window interaction problem.
For interactive operation, when calling the showModalDialog or showModelessDialog method, the second parameter passes the window, such as:
Window. ShowModelessDialog (' filename. HTM, window, 'dialogWidth = 200 px; DialogHeight = 250 px; ')
Next, is to get some data and methods of the parent window, which is often used, the parent window to take the parameters of the child window generally through the returnValue can be done


//Gets the JS variable var of the parent window
window.dialogArguments.var; 
//Gets the objects and properties of the parent window
window.dialogArguments.form1.name.value ; 
//Call the parent window's method fun
window.dialogArguments.fun() ;

Related articles: