easyui 动态选中特定Tabs
1、引用easyui
2、//html
点击选中特定Tab
<div style="margin:20px 0;">
<input name="select" type="radio" onclick="selectTabs('0')"><span>1</span>
<input name="select" type="radio" onclick="selectTabs('1')"><span>2</span>
<input name="select" type="radio" onclick="selectTabs('2')"><span>3</span>
<input name="select" type="radio" onclick="selectTabs('3')"><span>4</span>
</div>
<div id="tt" class="easyui-tabs" style="width:700px;height:250px">
<div title="11" style="padding:10px">
第一个Tab面板
</div>
<div title="12" style="padding:10px">
第二个Tab面板
</div>
<div title="13" style="padding:10px">
第三个Tab面板
</div>
<div title="14" style="padding:10px">
第四个Tab面板
</div>
</div>
3、//script
function selectTabs(i) {
//这一步，得到当前选中的面板，设置selected:false
//如果这一步不设置，则只在第一次点击的时候好用
var _Tab_Selected = $('#tt').tabs('getSelected');
var _Tab_Selected_Index = $('#tt').tabs('getTabIndex', _Tab_Selected);
$('#tt').tabs('update', {
tab: _Tab_Selected,
options: {
selected: false
}
});
//这一步是网上出现最多的解决办法
var _i = Number(i);
var _Tab = $('#tt').tabs('getTab', _i);
$('#tt').tabs('update', {
tab: _Tab,
options: {
selected: true
}
});
//这一步是用于刷新tabs插件，不加的话，tabs不会刷新，不显示最新选中面板。
$('#tt').tabs({
plain: 0
})
}