Let's talk about the basic usage of window.showmodalDialog
showmodalDialog () (IE 4+ support)
showmodelessDialog () (IE 5+ support)
Window.showModalDialog () method is used to create a modular dialog box that displays the HTML content.
Window.showmodelessDialog () method is used to create an non -modal dialog box that displays HTML content.
How to use:
vreturnValue = Window.showmodalDialog (Surl [, Varguments] [, Sfeatures]))
vreturnValue = Window.showmodelessDialog (Surl [, VARGUMENTS] [, Sfeatures])))
Parameter description:
Surl-must-choose parameters, type: string. URL used to specify the document to be displayed in the dialog box.
varguments-optional parameter, type: variant. Used to pass parameters to the dialog box. The parameter type passed by is not limited, including array, etc. The dialog box obtains parameters passed in through Window.Dialogarguments.
SFEATURES-optional parameter, type: string. Used to describe the appearance and other information of the dialog box, you can use one or more below, and use the segment ";" to separate.
1. Dialogheight: The dialog box height, not less than 100px, Dialogheight and Dialogwidth in IE4 are EM, and IE5 is PX, which is convenient for the MODAL dialog box.
2. Dialogwidth: Dialog box width.
3.Dialogleft: distance from the left of the screen.
4. Dialogtop: distance from the screen.
5.center: {yes | no | 1 | 0}: Whether the window is centered, the default 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+]: Whether it can be changed. The default NO.
8.status: {yes | no | 1 | 0} [IE5+]: Whether to display the status bar. The default is yes [modeless] or no [modal].
9.Scroll: {yes | no | 1 | 0 | 0 | OFF}: indicate whether the dialog box displays the rolling bar. The 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 | 0 | OFF}: Whether the dialog box is hidden during printing or printing preview. The default is NO.
11.edge: {Sunken | Raised}: Indicate the border style of the dialog box. The default is raise.
12.unadorned: {yes | no | 1 | 0 | 0 | OFF}: The default is NO.
Parameter transmission:
1. If you want to pass the parameters in the dialog box, you can pass through Varguments. The type is not limited. For the string type, the maximum is 4096 characters. You can also pass the object, such as:
Copy code code as follows:
<script>
var obj = new object ();
obj.name = "ttop";
Window.showmodalDialog ("test.htm", obj, "dialogwidth = 200px; dialogheight = 100px");
</script>
test.htm
<script>
var obj = window.dialogarguments
Alert ("The parameters you pass are:" + Obj.name)
</script>
2. You can return the information to the window that opens the dialog box through Window.ReturnValue. Of course, it can also be an object. For example:
Copy code code as follows:
<script>
Str = window.showmodalDialog ("test.htm", "dialogwidth = 200px; dialogheight = 100px");
alert (str);
</script>
test.htm
<script>
window.returnValue = "/";
</script>
1. What is the difference between ShowmodalDialog and ShowmodeElessDialog?
ShowmodalDialog: After being opened, it will always keep the input focus. Unless the dialog box is closed, users cannot switch to the main window. Similar to the operation effect of Alert.
ShowmodelessDialog: After being opened, users can randomly switch the input focus. It has no impact on the main window (at most it is blocked.: P)
Second, how can we let a new window be popped up in ShowmodalDialog and ShowmodelessDialog?
Add <base target = "_ seld"> to the open web pages. This sentence is generally placed between <HTML> and <body>.
How to refresh the content in ShowmodalDialog and ShowmodelessDialog?
In ShowmodalDialog and ShowmodelessDialog, F5 cannot be refreshed and the menu cannot be popped up. This can only rely on JavaScript. The following is the relevant code:
<body onkeydown = "if (event.keycode == 116) {regoad.clICK ()}">
<A ID = "RELOAD" HREF = "FILENAME.HTM" STYLE = "Display: None"> Reload ... </a>
Replace Filename.htm with the name of the webpage and put it in the webpage you opened. Press F5 to refresh. Note that this should be used with <base target = "_ seld"> Window.
Fourth, how to close the window of Showmodaldialog (or ShowmodeElessDialog) with JavaScript.
<input type = "Button" value = "Close" OnClick = "Window.Close ()">
Also cooperate with <base target = "_ seld">, otherwise it will open a new IE window and then turn it off.
5. ShowmodalDialog and ShowmodeElessDialog data transmission techniques.
(Author's words: I originally wanted to write it in a question and answer, but I couldn't think of this, so I had to do this.)
This thing is more troublesome. I have changed it several times. I ca n’t understand it (the level of language is getting worse and worse), so I have to use an example to explain.
Example: Now you need to read or set a variable var_name
General transmission method:
Window.showmodalDialog ("FILENAME.HTM", VAR_NAME)
// Transfer var_name variables
When reading and setting in ShowmodalDialicalog (or ShowmodeElessDialog)::
alert (window.dialogarguments) // Read the var_name variable
Window.dialogarguments = "oyiBoy" // Set var_name variable
This method can be satisfied, but when do you want to operate VAR_NAME and then operate the second change VAR_ID at the same time? It will not be able to operate anymore. This is the limitations of this transmission method.
The following is the way I recommend using it:
Window.showmodalDialog ("FILENAME.HTM", Window)
// No matter what variables to be operated, only the Window object of the main window is directly transmitted
When reading and setting in ShowmodalDialicalog (or ShowmodeElessDialog)::
alert (window.dialogarguments.var_name) // Read the var_name variable
Window.Dialogarguments.var_name = "Oyiboy" // Set var_name variable
At the same time, I can also operate the VAR_ID variable
alert (window.dialogarguments.var_id) // Read the var_id variable
Window.dialogarguments.var_id = "001" // Set var_id variable
Also can operate any object of the main window, such as the elements in the Form object.
Window.Dialogarguments.Form1.Index1.Value = "This is the value of the index1 element"
On the parent page, use onClight = "" "varite = window.showmodalog ('Changephoto.htm', 'Dialogwidth: 500px; Dialogheight: 300px; help: no'); if (Typ EOF (Reval)! = 'Undefined') { Form.TextName.value = Reval;} "STYLE =" "Cursor: Hand"> Click here to modify the picture
Open a framework set in the word window 'Changephoto.htm'. The framework concentrated contains an ASP file. First, return the value of the ASP to Changephoto.htm and return this value to the homepage.
CHANGEPHOTO.htm: <input Type = Button Onclick = "OnClose ();" Value = "Close">>
Function onClose () {window.returnValue = form1.save.value; // can also change window.returnValue to window.dialGuaster.blogImage.value Windo w.close ();}
asp file: Parent.document.form1.save.Value = "Value or Various";