用js互相調用iframe頁面的方法

最近,天天搞論文開題報告,一時技癢,再次設計Web,一下子就碰到一個問題,以前設計WEB頁的時候都是在IE裏 面跑的,從來沒有考慮過firefox 更別提chrome了,可是現在不同了,至少我認爲不兼容Firefox的WEB頁面是極其醜陋和山寨的,所以從有個這個觀念開始,我設計頁面就開始注意 這個兼容性,而這次就碰到一個兼容性的問題,html裏面有一個浮動框架,<iframe >,可以在頁面中內嵌入一個頁面,用來做框架頁面非常適合。

用js互相調用iframe頁面的方法

一個html頁面,分成左右兩塊,左邊爲導航欄,右邊爲需要顯示的內容,代碼如下:

  左欄的代碼爲:

<IFRAME frameBorder=0 id=frmTitleLeft name=framLeft src="" style="HEIGHT: 100%; width:180px;">

連接到

右欄也類似,就本人所做的.頁面,預覽的效果如下:

現在要達到什麼樣的效果才能起到比較實用的效果呢,點擊其中的任何鏈接,都可以在右欄顯示,那麼很顯然需要通過js來實現,原始的不兼容的辦法我也不多說了,請大家記住以下實現步驟:

  1,首先獲得右欄iframe對象

var frames=lementById("frameid");//frameid即右欄iframe的id名

  2,重置其src值

=pageurl;//pageurl即要顯示的目的頁面

這樣就實現了頁面的跳轉

  但是還有一點,如果想調用其中的函數就不是這麼簡單了

比如右欄中有一個函數right(),我要在左欄的鏈接中調用right()函數,該如何實現呢

1,首先leftframe是內嵌在容器頁中的,因此需要先返回到index這一級別,並取得rightframe對象

var frames=lementById("frameid");

2,要能執行其頁面中的函數,必須要獲得window對象,這裏有一個重要的對象contentWindow,獲得這個對象,即可執行其中的函數了,如

t();