只刷新bootstrap中包含iframe的当前导航选项卡

Question

我使用导航选项卡进行引导，我有3个选项卡，每个选项卡显示显示页面的iframe。 我注意到与每个选项卡相关的三个页面只更新一次（首次访问主页面）。稍后当我从标签移动到另一个时，标签不会更新。我希望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> 

我该怎么办呢？

Answer 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（）;