Multi-page sharing sub-window technology, such as music player [transferred from csdn: net_lover]

 

Multi-page sharing sub-Window Technology This is a problem from the Forum. The problem requires multiple different pages. When opening a subpage, you must share the same window and the subwindow cannot be refreshed. This is similar to adding and playing Google music. Because when playing music, if the child page is refreshed, the music must be played from the beginning, which is naturally unsatisfactory. Similar situations may also occur on the video website.

Below, we use simple JavascriptCodeTo implement this function. This code is successfully tested in all mainstream browsers.

Next, create a test main page, test1.htm

XML/XHTML code <! Doctype HTML public "-// W3C // dtd xhtml 1.0 transitional // en"
Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" >
< Html Xmlns = "Http://www.w3.org/1999/xhtml" >
< Head >
< Title > </ Title >
< Script Type = "Text/JavaScript" >
Function winopen (){
Window. Open ("wina.htm? Music = from_test1 _ "+ (new date (). tolocalestring ()," mxh "," width = 600, Height = 300 ")
}
</ Script >
</ Head >
< Body >
< Input Type = "Button" Onclick = "Winopen ()" Value = "Open subwindow" />
</ Body >
</ Html >

Create wina.htm

 

XML/XHTML code <! Doctype HTML public "-// W3C // dtd xhtml 1.0 transitional // en"
Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" >
< Html Xmlns = "Http://www.w3.org/1999/xhtml" >
< Head >
< Title > Window </ Title >
</ Head >
< Body >
< H1 > Here is window </ H1 >
< Script Type = "Text/JavaScript" >
If (window. Location. href = Window. Top. Location. href ){
Self. Top. Location. href = "winb.htm" + window. Location. Search
}
Else {
Window. Parent. Frames ["mxh2"]. setmusic (window. Location. Search. substr (1 ))
}
</ Script >
</ Body >
</ Html >

Winb.htm

XML/XHTML code <! Doctype HTML public "-// W3C // dtd xhtml 1.0 transitional // en"
Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" >
< Html Xmlns = "Http://www.w3.org/1999/xhtml" >
< Head >
< Title > Window B </ Title >
</ Head >
< Body >
< IFRAME Name = "Mxh2" SRC = "Winc.htm" Style = "Width: 600px; Height: 400px ;" Frameborder = "0" > </ IFRAME >
< IFRAME Name = "Mxh" SRC = "Wind.htm" Style = 'Display: none' > </ IFRAME >
< Script Type = "Text/JavaScript" >
Alert ("Page refresh detector ")
</ Script >
</ Body >
</ Html >

Winc.htm

XML/XHTML code <! Doctype HTML public "-// W3C // dtd xhtml 1.0 transitional // en"
Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" >
< Html Xmlns = "Http://www.w3.org/1999/xhtml" >
< Head >
< Title > Window C </ Title >
</ Head >
< Body >
< Div ID = "Showcontent" > Initialized content </ Div >
< Script Type = "Text/JavaScript" >
Function setmusic (STR ){
Document. getelementbyid ("showcontent"). innerhtml + =" < BR /> "+ Str
}
</ Script >
</ Body >
</ Html >

Wind.htm

XML/XHTML code <! Doctype HTML public "-// W3C // dtd xhtml 1.0 transitional // en"
Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" >
< Html Xmlns = "Http://www.w3.org/1999/xhtml" >
< Head >
< Title > Window d </ Title >
</ Head >
< Body >
< Script Type = "Text/JavaScript" >
Window. Name = "mxh ";
Window. Top. Name = "";
Window. Top. Focus ();
</ Script >
</ Body >
</ Html >

Then you can create multiple test pages test2.htm.

XML/XHTML code <! Doctype HTML public "-// W3C // dtd xhtml 1.0 transitional // en"
Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" >
< Html Xmlns = "Http://www.w3.org/1999/xhtml" >
< Head >
< Title > </ Title >
< Script Type = "Text/JavaScript" >
Function winopen (){
Window. Open ("wina.htm? Music = from_test2 _ "+ (new date (). tolocalestring ()," mxh "," width = 600, Height = 300 ")
}
</ Script >
</ Head >
< Body >
< Input Type = "Button" Onclick = "Winopen ()" Value = "Open subwindow" />
</ Body >
</ Html >

In different windows, when the test page is opened, the content is displayed in the main window of window B. The page is not refreshed. The principle is to open a new page in a hidden window, take the passed parameters, and use JavaScript to transmit data. Among them, the scripts in wind.htm are indispensable.

The above code is a bit confusing, hoping that readers will not be confused. Pai_^