JavaScript - Back Button With Frames

JavaScript

Back Button With Frames

Back buttons are used to return to the previous page. This is the same as using the back button on your browser.

Every frame has its own history list of documents that were loaded into it. To go back in a frame other than the frame containing the button, the frame name must be specified.

For a form button use the ONCLICK eventhandler:

<FORM>
            <INPUT TYPE="BUTTON" VALUE="Go Back" ONCLICK="parent.otherframe.history.go(-1)">
            </FORM>

For a text link use HREF=:

<A HREF="javascript:parent.otherframename.history.go(-1)">[Go
            Back]</A>

For an image link use HREF=:

<A HREF="javascript:parent.otherframe.history.go(-1)">
            <IMG SRC="http://www.mydomain.com/images/back.gif"
            BORDER="0"> </A>

Change 'otherframe' to the name of the frame you want to go back in. The 'parent' part of the statement refers to the outer most window and is always called parent. The 'otherframe' refers to the name of frame you want to go back in. The 'history' refers to the history list for that frame. The 'go(-1)' tells the browser to go -1 or back 1 in that frames history list.

Example:

This link opens frames example with form buttons
This link opens frames example with images for buttons
This link opens frames example with text links

To go back in a specific frame you must tell the browser which frame to go back in. There are two frames defined in the HTML code below. The first one is named menu and the second is named main.:

<FRAMESET ROWS="25%,75%">
<FRAMESRC="menu.html" NAME="menu"  SCROLLING="AUTO" NORESIZE="NORESIZE" >
<FRAME SRC="homepage.html" NAME="main" SCROLLING="AUTO"
NORESIZE="NORESIZE"><NOFRAMES>
<BODY></BODY></NOFRAMES>
</FRAMESET>

If the back button is in the frame named menu and you want to go back one document in the frame named main, the code would be:

Code:

For a form button the code would be:

<FORM>
<INPUT TYPE="BUTTON" VALUE="Go Back" ONCLICK="parent.main.history.go(-1)">
</FORM>

For text used as a link the code would be:

<A HREF="javascript:parent.main.history.go(-1)">[Go Back]</A>

For an image used as a link the code would be:

<A HREF="javascript:parent.main.history.go(-1)">
<IMG SRC="http://www.mydomain.com/images/back.gif" BORDER="0">
</A>