<title>Bootstrap 实例 - 默认的面板</title>
<link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script type="text/javascript">
!function(t){"use strict"
var a=function(a,e){return null===a||void 0===a||0===a.length||e&&""===t.trim(a)},e={timeout:3e5,data:{},exist:function(t){return!!e.data[t]&&(new Date).getTime()-e.data[t]<e.timeout},set:function(t){delete e.data[t],e.data[t]=(new Date).getTime()}},i=function(a,e){var i=this
i.$element=t(a),i.init(e),i.listen()}
i.prototype={constructor:i,init:function(i){var s,n=this,r=n.$element
t.each(i,function(t,a){n[t]=a}),s=n.enableCache,a(n.addCss)||r.hasClass(n.addCss)||r.addClass(n.addCss),n.enableCache=s===!0||"true"===s||1===parseInt(s),n.$pane=r.find(".tab-pane.active"),n.$content=r.find(".tab-content"),n.$tabs=r.find(".nav-tabs"),n.isVertical=r.hasClass("tabs-left")||r.hasClass("tabs-right"),n.isVerticalSide=n.isVertical&&r.hasClass("tab-sideways"),n.isVertical&&n.$content.css("min-height",n.$tabs.outerHeight()+1+"px"),e.timeout=n.cacheTimeout},setTitle:function(e){var i=this,s=t.trim(e.text()),n=i.isVertical,r=a(e.data("maxTitleLength"))?i.maxTitleLength:e.data("maxTitleLength")
n&&s.length>r-2&&a(e.attr("title"))&&e.attr("title",s)},listen:function(){var i=this,s=i.$element,n=s.data().flexheight?s.data().flexheight:60
s.find(".nav-tabs li.disabled").each(function(){t(this).find('[data-toggle="tab"]').removeAttr("data-toggle")}),s.find('.nav-tabs li [data-toggle="dropdown"]').each(function(){i.setTitle(t(this))}),s.find('.nav-tabs li [data-toggle="tab"]').each(function(){var s=t(this),r=s.closest("li"),l=s.attr("data-iframe")
r.removeAttr("data-toggle"),i.setTitle(s),s.on("click",function(l){if(r.hasClass("disabled"))return void l.preventDefault()
var o,c=t(this).attr("data-url"),d=this.hash,f=c+d,h=t(this).attr("data-iframe")
if(a(c)||i.enableCache&&e.exist(f))return void s.trigger("tabsX.click")
var u=t(d),b=t(this),g=b,m=t(this).attr("data-loading-class")||"kv-tab-loading",v=b.closest(".dropdown"),p=i.successCallback[d]||null,C=i.errorCallback[d]||null
if(a(v.attr("class"))||(g=v.find(".dropdown-toggle")),h){var y=t(window).height()-n,x='<div class="tabx-body"><iframe style="width:100%;height:'+y+'px;" frameborder="0" src="'+c+'"></iframe></div>'
if(u.html(x),b.tab("show"),g.removeClass(m),i.enableCache&&e.set(f),p&&"function"==typeof p&&p(data,status,jqXHR),laydialog){var w=laydialog.load()
t(".tabx-body iframe:visible").load(function(){laydialog.close(w)})}}else o=t.extend({type:"post",dataType:"json",url:c,beforeSend:function(t,a){u.html("<br><br><br>"),g.removeClass(m).addClass(m),s.trigger("tabsX.beforeSend",[t,a])},success:function(t,a,n){setTimeout(function(){u.html(t),b.tab("show"),g.removeClass(m),i.enableCache&&e.set(f),p&&"function"==typeof p&&p(t,a,n),s.trigger("tabsX.success",[t,a,n])},300)},error:function(t,a,e){C&&"function"==typeof C&&C(t,a,e),s.trigger("tabsX.error",[t,a,e])},complete:function(t,a){s.trigger("tabsX.click",[t,a])}},i.ajaxSettings),t.ajax(o)}),r.is(".active")&&l&&s.trigger("click")})}},t.fn.tabsX=function(a){var e=Array.apply(null,arguments)
return e.shift(),this.each(function(){var s=t(this),n=s.data("tabsX"),r="object"==typeof a&&a
n||(n=new i(this,t.extend({},t.fn.tabsX.defaults,r,t(this).data())),s.data("tabsX",n)),"string"==typeof a&&n[a].apply(n,e)})},t.fn.tabsX.Constructor=i,t.fn.tabsX.defaults={enableCache:!0,cacheTimeout:3e5,maxTitleLength:9,ajaxSettings:{},successCallback:{},errorCallback:{},addCss:"tabs-krajee"},t(document).on("ready",function(){t(".tabs-x").tabsX({})})}(window.jQuery)
<div class="tabs-container tabs-x align-center" >
<ul id="myTab" class="nav nav-tabs" style="width:100%;display:inlinestyle">
<a data-toggle="tab" href="#tab-1" data-iframe="true" aria-expanded="true"
tabindex="-1" data-url="https://www.baidu.com/">功能1</a>
<a data-toggle="tab" href="#tab-2" data-iframe="true"
tabindex="-1" data-url="http://www.sina.com.cn/" aria-expanded="true" >功能2</a>
<div class="tab-content">
<div id="tab-1" class="tab-pane in active">
<div id="tab-2" class="tab-pane">