Summary of learning experience of window.showModalDialog() return value_javascript skills

Let’s first talk about the basic usage of window.showModalDialog

showModalDialog() (supported by IE 4)
showModelessDialog() (supported by IE 5)
The window.showModalDialog() method is used to create a modal dialog box that displays HTML content.
The window.showModelessDialog() method is used to create a non-modal dialog box that displays HTML content.

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

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

vArguments--optional parameters, type: variant. Used to pass parameters to the dialog box. The type of parameters passed is not limited, including arrays, etc. The dialog box obtains the parameters passed in through window.dialogArguments.

sFeatures--optional parameters, type: string. Used to describe the appearance of the dialog box and other information, you can use one or more of the following, separated by semicolons ";".

1.dialogHeight:The height of the dialog box, not less than 100px. The default units of dialogHeight and dialogWidth in IE4 are em, while in IE5 it is px. For convenience, define the modal mode dialog box When, use px as the unit.
2.dialogWidth: Dialog width.
3.dialogLeft: Distance from the left side of the screen.
4.dialogTop: 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 it can be resized. The default is no.
8.status: {yes | no | 1 | 0} [IE5]: Whether to display the status bar. Default is yes[Modal] or no[Modal].
9.scroll:{ yes | no | 1 | 0 | on | off }: Indicate whether the dialog box displays scroll bars. The default is yes.

The following attributes are used in HTA and are generally not used in ordinary web pages.
10.dialogHide:{ yes | no | 1 | 0 | on | off }: Whether the dialog box is hidden during printing or print 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 }: Default is no.

Parameter passing:
1. To pass parameters to the dialog box, they are passed through vArguments. There is no limit on the type. For string types, the maximum length is 4096 characters. You can also pass objects, for example:

Copy code The code is as follows:

<script><BR>var obj = new Object();<BR>obj.name="ttop";<BR>window.showModalDialog("test.htm",obj,"dialogWidth=200px;dialogHeight=100px");<BR> </script>
test.htm
<script><BR>var obj = window.dialogArguments<BR>alert("The parameter you passed is: " obj.name)<BR></ script><BR></script>

2. You can use window.returnValue to return information to the window where the dialog box is opened, or of course it can be an object. For example:

Copy code The code is as follows:

<script><BR>str =window .showModalDialog("test.htm",,"dialogWidth=200px;dialogHeight=100px");<BR>alert(str);<BR></script>
test.htm
<script> <BR>window.returnValue="/";<BR></script>

1. What is the difference between showModalDialog and showModelessDialog?

showModalDialog: After being opened, the input focus will always be maintained. The user cannot switch to the main window unless the dialog box is closed. Similar to the operation effect of alert.

showModelessDialog: After being opened, the user can switch the input focus randomly. It has no effect on the main window (at most it is blocked for a while. :P)

2. How to prevent the hyperlinks in showModalDialog and showModelessDialog from popping up new windows?

Just add to the opened web page. This sentence is usually placed between and

.

3. How to refresh the content in showModalDialog and showModelessDialog?

You cannot press F5 to refresh in showModalDialog and showModelessDialog, and the menu cannot pop up. This can only rely on javascript. The following is the relevant code:

reload...

Replace filename.htm with the name of the web page and put it into the web page you open. Press F5 to refresh. Note that this must be used in conjunction with , otherwise you press Press F5 and a new window will pop up.

4. How to use javascript to close the window opened by showModalDialog (or showModelessDialog).

Also cooperate with , otherwise a new IE window will be opened and then closed.

5. Data transfer skills of showModalDialog and showModelessDialog.
(Author’s note: I originally wanted to write it in a question-and-answer format, but I couldn’t figure out how to ask this, so I had to do this.)

This thing is quite troublesome. I have changed it several times and it’s not that I can’t explain it clearly (my language skills are 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

in a showModalDialog (or showModelessDialog)

General delivery method:
window.showModalDialog("filename.htm",var_name)
//Pass the var_name variable
Read and set in showModalDialog (or showModelessDialog) When:
alert(window.dialogArguments)//Read the var_name variable
window.dialogArguments="oyiboy"//Set the var_name variable
This method is satisfactory, but when you want to operate var_name What about when the second variation var_id is operated at the same time? It can no longer be operated. This is the limitation of this delivery method.
　
The following is the delivery method I recommend:
window.showModalDialog("filename.htm",window)
//No matter what variables you want to operate, just pass them directly When the window object
of the main window is read and set by showModalDialog (or showModelessDialog):
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 the var_id variable

You can also operate on any object in the main window, such as elements in the form object.
window.dialogArguments.form1.index1.value="This is setting the value of the index1 element"

Use onClick=""var reVal = window.showModalDialog('changephoto.htm','dialogWidth:500px;dialogHeight:300px;help:no' in the parent page );if (typeof(reVal) != 'undefined') {form.textname.value=reVal;}"" cursor:hand "">Click here to modify the image

Open a frameset in the word window 'changephoto.htm'. The frameset contains an asp file. First return the asp value to changephoto.htm and then return this value to the main page

changephoto.htm:

function onClose() { window.returnValue = form1.save.value;//You can also change window.returnValue to window.dialogArguments.oblogform.blogimage.value window.close(); }

asp file: parent.document.form1.save.value="value or variable";