通过 data 属性启用标签页可以自动切换标签页内容，如果不按照选中的标签页激活状态加载数据，则需要在页面启动时把每个标签页的内容一并加载完成，同时请求多个接口数据会影响页面启动速度；可以通过Javascript来启用标签页，控制加载的数据显示。
如下图所示的页面效果：
初始加载页面时只加载标签页1的内容，通过js监听标签页的点击事件来加载数据，未切换的标签页不加载数据，同时，如果表格数据已加载，则不再重复请求接口数据，实现方式如下：
$('#myTab a').click(function (e) {
e.preventDefault()
$(this).tab('show');
var curTab =$(this).attr('href');
var id = curTab.substr(1);
if (id =="tab1") {//加载第一个标签页内容
if (gridObj1==null) {
initGrid1();
}
}else if (id =="tab2") {
if (gridObj2 ==null) {//未初始化才加载数据
initGrid2();
}
}
})
当针对表格查询时，只搜索当前标签页表格数据，不搜索其他标签页的表格，实现方式如下：
function doQuery() {
var searchParames =$("#searchForm").serializeArray();
if ($('#tab1').hasClass('active')) {//查询标签页1的表格数据
gridObj1.search(searchParames);
}else if ($('#tab2').hasClass('active')) {//查询标签页2的表格数据
gridObj2.search(searchParames);
}
}
