Communication between the home page and the slave page in window. open and window. showModalDialog (original)

Source: Internet
Author: User

Due to the poor front-end performance, you have to query every problem. This is not just a small problem. I checked it and shared the query results (simple, you can skip this article)

I. Theory

Window. open and window. showModalDialog. The former is used to open a new browser window or find a named window. The latter is used to create a modal dialog box displaying HTML content.

Dialog box, so it does not have all the properties of the window opened with window. open.

Communication between the home page and the slave page includes passing values from the home page to the slave page and the slave page to the home page. because the former is relatively simple, this article only describes the latter.

2. Example

1. window. showModalDialog example

The zhu.html code is as follows:

<Html>
<Head>
<Title> example </title>
</Head>
<Body>
<Center>
<Form name = "form1">
<Br/>
<H1> click the button and select the color you like <Br/>
<Input type = "button" value = "select color" onClick = "Selectcolor ()"/>
<Br/>
<Br/>
<Input type = "text" name = "Textbox" size = "20"/>
<Br/>
</Form>
</Center>
</Body>
<Script language = "javascript">
Function Selectcolor ()
{
Document. form1.Textbox. value = window. showModalDialog ("cong.html ");
}
</Script>
</Html>

The cong.html code is as follows:

<Html>
<Head>
<Title> test dialog box </title>
</Head>
<Body>
<Center>
<Form name = "form1">
<Br/>
<Br/>
<H1> select your preferred color <Br/>
<Table bordercolor = "#00 FFFF" width = "200">
<Tr>
<Td>
<Input type = "radio" name = "RadioButtons" onclick = "radio1Clicked ()"/> Red
</Td>
</Tr>
<Tr>
<Td>
<Input type = "radio" name = "RadioButtons" onClick = "radio2Clicked ()"> orange
</Td>
</Tr>
</Table>
<Br/>
<Input type = "button" value = "OK" onClick = "OKButton ()"/>
<Input type = "button" value = "cancel" onClick = "CancelButton ()"/>
</Form>
</Center>
</Body>
<Script language = "javascript">
Var selectedcolor = "not selected ";
Function radio1Clicked ()
{
Selectedcolor = "red ";
}
Function radio2Clicked ()
{
Selectedcolor = "orange ";
}
Function OKButton ()
{
Window. returnValue = "the color you selected is:" + selectedcolor;
Window. close ();
}
Function CancelButton ()
{
Window. returnValue = "You have not selected ";
Window. close ();
}
</Script>
</Html>

2. window. open () Example

You only need to change the red section of zhu.html to: window. open ("cong.html" character and cong.html Red Section to: character opener.doc ument. getElementById ("TextBox"). value
= "The color you selected is:" + selectedcolor;

Summary:

1. the return value of window. showModalDialog ("cong.htm") is: the response returnvalueof the cong.html page. Therefore, you only need to assign values to window. returnValue on the cong.html page,

Then you can call the return value on the zhu.html page.

2. window. open ("cong.html") the return value is: the introduction to the window (Failure Returns null.pdf, too many openerrefers to the window that calls the original open.pdf, that is, the window of the cong.html window,

That is: zhu.html, to complete access to the control in the Main Window

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.