相信許多小夥伴都遇到過在一個頁面中嵌入ifream標籤來引入另一個頁面,用的最爲多的是後臺管理之類的頁面,如:
這種管理頁面在沒有單頁面應用之前大部分是用ifream標籤改變頁面的,那麼有一個問題,在子頁面中跳往其他頁面並且要是藍色選中頁面導航也要變化怎麼實現呢~接下來說一下我是怎樣實現的,或許可能比較low,大家不要見諒啦~
1.藍色導航切換:一般藍色導航的切換是在其身上添加(點擊)click 事件,$(this).addClass('active-nav');其他的刪除class樣式;這樣子實現起來後期的子頁面內跳轉往往不容易改變當前導航的定位,所以我採用hash值來添加導航樣式。點擊導航時,window.location.hash值發生變換,之後通過hash值與當前事件的觸發者身上的某一個屬性映射,一一對應,添加class樣式。
2.當點擊子頁面要獲取父頁面的元素或者進行操作時,只要在獲取元素是注意一下就可以了:window.parent........
①.iframe子頁面調用父頁面js函數 : window.parent.a();/*子頁面調用父頁面內a函數*/
②.子頁面取父頁面中的標籤中的值: window.parent.document.getElementById("test").value;
jquery方法: $(window.parent.document).contents().find("test").val();
3.父頁面調用子頁面方法:
①.document.getElementById('ifrtest').contentWindow.b();