當前位置:才華齋>設計>網頁設計>

用js互相呼叫iframe頁面的方法

網頁設計 閱讀(5.34K)

最近,天天搞論文開題報告,一時技癢,再次設計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();