html <div class="container"> <ul class="tabs"> <li class="active">5秒鐘</li><li>10秒鐘</li><li>15秒鐘</li> </ul> <div class="tab_container" > <div id="tab1" ...
html
<div class="container">
<ul class="tabs">
<li class="active">5秒鐘</li>
<li>10秒鐘</li>
<li>15秒鐘</li>
</ul>
<div class="tab_container" >
<div id="tab1" class="tab_content" >
<div id="echart" style="width: 100%; height:400px;"></div>
<table class="table">
<thead>
<tr>
<th>時間</th>
<th>買入價格</th>
<th>買入數量</th>
</tr>
</thead>
<tbody id="btcData"></tbody>
</table>
</div>
<div id="tab2" class="tab_content">
<div id="echart1" style="width: 1100px; height:400px;"></div>
<table class="table">
<thead>
<tr>
<th>時間</th>
<th>買入價格</th>
<th>買入數量</th>
</tr>
</thead>
<tbody id="btcData1"></tbody>
</table>
</div>
<div id="tab3" class="tab_content">
<div id="echart2" style="width: 1100px; height:400px;"></div>
<table class="table">
<thead>
<tr>
<th>時間</th>
<th>買入價格</th>
<th>買入數量</th>
</tr>
</thead>
<tbody id="btcData2"> </tbody>
</table>
</div>
</div>
</div>
js
$(document).ready(function() {
$("ul.tabs li:first").addClass("active").show();
$(".tab_container .tab_content").not(':first-of-type').hide();
/**
*點擊事件
*/
$("ul.tabs li").on("click",function() {
$(this).addClass("active").siblings().removeClass("active");
var index = $(this).index();
$(".tab_container .tab_content").eq(index).show();
$(".tab_container .tab_content").eq(index).siblings().hide();
});})
