2017-08-10 88 views
1

我使用導航選項卡進行引導,我有3個選項卡,每個選項卡顯示顯示頁面的iframe。 我注意到與每個選項卡相關的三個頁面只更新一次(首次訪問主頁面)。稍後當我從標籤移動到另一個時,標籤不會更新。我希望iframe中顯示的頁面一旦被選中就更新,因爲它從數據庫讀取數據,我需要它是最新的。只刷新bootstrap中包含iframe的當前導航選項卡

<ul class="nav nav-tabs"> 
<li class="active"><a data-toggle="tab" href="#home">Home</a></li> 
<li><a data-toggle="tab" href="#menu1">Menu 1</a></li> 
<li><a data-toggle="tab" href="#menu2">Menu 2</a></li> 
</ul> 

<div class="tab-content"> 
<div id="home" class="tab-pane fade in active"> 
    <iframe src="Page1.aspx" style="width:100%; height:850px ; border:none"; id="frame1"></iframe> 
</div> 
<div id="menu1" class="tab-pane fade"> 
    <iframe src="Page2.aspx" style="width:100%; height:850px ; border:none"; id="frame2"></iframe> 
</div> 
<div id="menu2" class="tab-pane fade"> 
    <iframe src="Page3.aspx" style="width:100%; height:850px ; border:none"; id="frame3"></iframe> 
</div> 

我該怎麼辦呢?

回答

1

function refresh(val){ 
 
    document.getElementById('#' + val).contentWindow.location.reload(); 
 
}
<ul class="nav nav-tabs"> 
 
<li class="active"><a data-toggle="tab" href="#home">Home</a></li> 
 
<li><a data-toggle="tab" href="#menu1">Menu 1</a></li> 
 
<li><a data-toggle="tab" href="#menu2">Menu 2</a></li> 
 
</ul> 
 

 
<div class="tab-content"> 
 
<div id="home" class="tab-pane fade in active"> 
 
    <iframe src="Page1.aspx" style="width:100%; height:850px ; border:none"; id="frame1" onclick="refresh('frame1')"></iframe> 
 
</div> 
 
<div id="menu1" class="tab-pane fade"> 
 
    <iframe src="Page2.aspx" style="width:100%; height:850px ; border:none"; id="frame2" 
 
    onclick="refresh('frame1')"></iframe> 
 
</div> 
 
<div id="menu2" class="tab-pane fade"> 
 
    <iframe src="Page3.aspx" style="width:100%; height:850px ; border:none"; id="frame3" onclick="refresh('frame1')"></iframe> 
 
</div>
在點擊通話刷新功能,並通過ID。 //此語句將刷新Iframe。 content.Windows.location.reload(); document.getElementById('some_frame_id')。contentWindow.location.reload();

+0

不幸的是,沒有工作,iframe沒有再次加載 – user1947393

+0

可以請更新plunker上的代碼。 –

+1

請在這裏找到https://plnkr.co/edit/RVKJYCANYtCurnfhveWY?p=preview,在iframe裏面的菜單2例如:如果我從右邊菜單中點擊一個鏈接,比如「Tables」,然後我去Menu1,然後回到Menu2,它顯示「Tables」上的頁面,但它不會改變。 – user1947393

相關問題