In a multi-window framed page, information interaction between sub-windows is common. If you click a hyperlink in the navigation window, how do you open the linked web page in another window? If I press a button in this window, can I write a message in another window? There are so many windows, how to identify them? Please see the example below.
1. Click the link in the navigation window to open the web page in another window
The existing one-frame page is as shown in the picture above. Window A is the website logo and advertisement, window B is the navigation bar, and window C is the window that displays the page. The source code of this framed page is:
| <framesetrows=20%,*> <framename=topFramescrolling=NOnoresizesrc=toppage.htm> <framesetcols=18%,*> <framename=leftFramenoresizesrc=leftpage.htm> <framename=mainFramesrc=mainpage.htm> </frameset> </frameset> |
If it is required that the linked page (test.htm) in window B be opened in window C, then the link in window B should be written as follows: <a herf=test.htm target=mailFrame> The page of this link should be opened in window C. </a>, the key role here is the target parameter in the <A> tag. If you want to open the web page in that window, set the name of that window in the Target parameter.
2. Press a button in window B and write a line of text in window C.
The page format of this example is the same as the previous example. The finished effect is as follows: After pressing the "Write in Window C" button in window B, a line of text "Hi! Hello! This is through Words written for B window control." The code for the framed page and the web page files in each window are the same as the above example.
Preparation method:
1. Insert the following Javascript program between the source code <head> and </head> of the C window web page (mainpage.htm):
| <scriptlanguage=Javascript> <!-- functionhtest(){ document.write(Hi! Hello! This is a word written through B window control.) } --> </script> |
The function of this program is to write a text in the current window.
2. So how to call the program in window C in window B? First look at the source code of the "Write in Window C" button in window B:
| <inputtype=buttonvalue=Write in C window onclick=parent.mainFrame.htest()> |
In this code, the key is the code "parent.mainFrame", which introduces a new concept - window structural relationship, that is, in a multi-window page, the relationship between windows is determined by what principles. The principle for determining the window relationship is: the window divided from the current window is the "child window" (children) of the current window, then the current window is the "parent window" (parent) of the divided window. For example, the relationship between the windows in this example is as follows:
As can be seen from the above table, the "browser window" is the "parent window" of "topFrame" and "lower window", and the lower window is the "parent window" of the two windows "leftFrame" and "mainFrame". The connection between the two windows must be through their parent windows, so in this example to call "htest()" on the web page in the C window, it is obviously through the parents of C and B and then to the mainFrame, and then call htest( )program.
So, if the code for writing text in window C to window B is like this: onclick=parent.leftFrame.htest(); then, do you know how to write the code for writing a piece of text in window A to window C? By the way, that’s it: onclick=grandchildren.mainFrame.htest().
As can be seen from the above example, the key issue in exchanging information between windows is to understand the relationship between windows, and other operations are relatively simple.