Use JS to call each other in the IFRAME page JS function

Source: Internet
Author: User

Recently, every day to do a paper issue report, a moment itched, design the web again, suddenly encountered a problem, the previous design of the Web page is in IE ran, never considered Firefox, not to mention Chrome, but now different, At least I think the incompatible Firefox Web page is extremely ugly and cottage, so from the beginning of this concept, I design the page began to pay attention to this compatibility, and this time encountered a compatibility problem, HTML inside a floating frame, <iframe, You can embed a page in the page, used to make frames page is very suitable, the following figure,
&NBSP;
an HTML page, divided into about two blocks, left for the navigation bar, the right for the content to be displayed, the code is as follows:
The code for the left column is:
< The IFRAME frameborder=0 id=frmtitleleft name=framleft src= "left.html" style= "height:100%"; width:180px; " >
Connect to left.html
Right column is similar to the page I did, the preview effect is as follows:
&NBSP;
now to achieve what kind of effect can play a more practical effect, click any of the links, can be displayed in the right column, then it is obviously necessary through JS to achieve, The original incompatible method I do not say more, please remember the following implementation steps:
1, first get the right column IFrame object
var Frames=document.getelementbyid ("Frameid"); Frameid is the right column IFRAME ID name
2, reset its src value
Frames.src=pageurl;//pageurl is the destination page to display
This enables the page to jump

But there's one more thing, If you want to call one of these functions, it's not that simple.
For example, there is a function right in the right-hand column (), I want to be in the leftThe right () function is called in the link in the column, how do you implement

1, first leftframe is embedded in the container page index.html, so you need to return to the index level first and get the Rightframe object
Var frames =window.parent.window.document.getelementbyid ("Frameid");

2, to be able to execute functions on its page, you must obtain the Window object, which has an important object, Contentwindow, to which you can perform functions such as
Frames.contentWindow.right ( );

The above code compatibility ie6,firefox3,chrome2.0, all successfully passed the test, IE7 did not try, but should be no problem.

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.