在选项卡内显示另一个页面的内容

Question

如何在选项卡中显示外部页面？我有这四个选项卡，目的是在单击时调用外部页面。

 <div class="bs-example bs-example-tabs" role="tabpanel" style="padding-top: 70px;">
            <ul id="myTab" class="nav nav-tabs" role="tablist">
              <li>
                  <a href="#ViewPools.aspx" id="#tab0" role="tab" data-toggle="tab"  >Pool
                </a></li>

                <li>
                 <a href="#tabCategory" id="#tab1" role="tab" data-toggle="tab" >Category
                </a></li>

                <li>
                <a href="#tab2" id="#tab2" role="tab" data-toggle="tab">SLA
                </a></li>

                <li>
                <a href="#tab3" id="#tab3" role="tab" data-toggle="tab">Notification
                </a></li>

            </ul>

            <div id="myTabContent" class="tab-content">
                <div class="tab-pane" id="ViewPools"></div>
            </div>
</div>

有什么方法可以使用 jquery 做到这一点吗？谢谢

Answer 1

<html>
<style type="text/css">
<!--
#container {
        width: 388px;
        height: 280px;
        border: 0px solid #000;
        overflow: hidden;
        margin: auto;
}

#container iframe {
        width: 1000px;
        height: 700px;
        margin-left: -514px;
        margin-top: -279px;
        border: 0 solid;
}
-->
</style>

</head>
<body>
    <div id="container">
    <iframe
        src="http://whosebug.com/"
        scrolling="no"></iframe>
    </div> 
</body>

您可以通过创建多个iframe来访问任意数量的页面，将您想要的网页替换为我在代码中使用的src。

Answer 2

使用下面对你有用的link，点击'category'。

Demo

在选项卡内显示另一个页面的内容

display the contents of another page inside tabs

jquery

tabs

twitter-bootstrap