使用easyUI创建Tabs标签

@author YHC

这个教程将告诉你如何使用easyui创建一个tabs 组件,Tabs 有多个panel可以动态的添加或移除,你可以使用tabs
显示不同的实体在相同的页面.

Tabs
一次仅仅显示一个panel,每个panel都有 title,icon and close 按钮,当tabs
选中时对应的panel内容将显示.



查看
Demo

从HTML标记创建Tabs
包含一个DIV容器,和一些DIV panel.

<div class="easyui-tabs" style="width:400px;height:100px;">
<div title="First Tab" style="padding:10px;">
First Tab
</div>
<div title="Second Tab" closable="true" style="padding:10px;">
Second Tab
</div>
<div title="Third Tab" iconCls="icon-reload" closable="true" style="padding:10px;">
Third Tab
</div>
</div>
我们创建一个tabs
组件和3个panel,第二个和第三个panel可以通过点击close按钮关闭.

下载 EasyUI 示例代码:

easyui-tabs-demo.zip