效果图:
<html>
<head>
<meta charset="UTF-8"> <title></title> <script type="text/javascript" src="../js/jquery.js"></script><script type="text/javascript" src="../js/ligerUi/ligerui.min.js"></script>
<script type="text/javascript" src="../js/ligerUi/ligerTab.js"></script> <link rel="stylesheet" href="../css/skins/Aqua/css/ligerui-all.css" /> <script> $(function() { $('#tab').ligerTab({ //showSwitchInTab: true, //showSwitch: true, width:300,//没有该属性,但不报错 height:600, //这个方法是选中tab后进行的操作 onAfterSelectTabItem: function(tabid) { if(tabid == 'tab1') { //第一个div进行的操作,如数据加载 //alert(11111111111) ; } if(tabid == 'tab2') { //第二个div进行的操作,如数据加载 // alert(22222222222) ; }}
});});
</script> </head><body>
<div id="tab" > <div title="tab1" tabid='tab1'> <div>1111111111111111111 </div> </div><div title="tab2" tabid='tab2'>
<div>22222222222222222 </div> </div><div title="tab3" tabid='tab3'>
<div>333333333333333333 </div> </div> </div></body>
</html>