下载“Ditchnet JSP Tabs Taglis”的jar文件；
将下载包中的jar文件复制到install_dir/tomcat/commn/lib目录下
确保你的web应用程序中的根目录是可写的
重载你的web应用程序
将org.ditchnet.taglib目录拷到你的web应用程序目录下
在你的JSP页面，添加tab标签库指示头，和XHTML的“Transitional Doctype”(用以验证CSS的正确性和浏览器的兼容性－查看相关的文章Doctype Switching)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<%@ page contentType="text/html"%>
<%@ taglib uri="http://ditchnet.org/jsp-tabs-taglib" prefix="tab"%>
<html xmlns="http://www.w3c.org/1999/xhtml" xml:lang="en" lang="en">
添加代码到页面的<head>标签中
<head>
<script type="text/javascript" src="org.ditchnet.taglib/tabs.js"></script>
<link type="text/css" rel="stylesheet" href="org.ditchnet.taglib/tabstyle.css" />
</head>
该标签创建<script>脚本和<link>标签，通过它们链接必要的CSS和JavaScript到页面。当然，你也可以添加额外的脚本或样式去覆盖缺省设置。
为你希望创建的每一个tabbed pane组添加一个<tab:tabContainer>标签
<tab:tabContainer>
</tab:tabContainer>
给<tab:tabContainer>标签一个id属性，该id在你的应用程序中（即Servlet Context环境）是唯一的
<tab:tabContainer id="foo-bar-container">
</tab:tabContainer>
注：该ID在你的应用程序中必需是唯一的，因为它在用户的会话中用于保持tab容器中被选定tab的索引。
在tab container中添加你想添加的<tab:tabPane>标签
<tab:tabContainer id="foo-bar-container">
<tab:tabPane></tab:tabPane>
<tab:tabPane></tab:tabPane>
</tab:tabContainer>
为每个<tab:tabPane>标签设定一个必需的id和tabTitle属性。id将被无改变传递给页面，tabTitle将被用于在tab container的顶部标明tabPane选项卡的标题。就像在html页面中一样，id对于页面来说必须唯一。
<tab:tabContainer id="foo-bar-container">
<tab:tabPane id="foo" tabTitle="Foo!"></tab:tabPane>
<tab:tabPane id="bar" tabTitle="Bar!"></tab:tabPane>
<tab:tabContainer>
在希望的地方添加HTML或JSP页面内容
<tab:tabContainer id="foo-bar-container">
<tab:tabPane id="foo" tabTitle="Foo!">
Foo is cool!
</tab:tabPane>
<tab:tabPane id="bar" tabTitle="Bar!">
Bar is cool!
</tab:tabPane>
<tab:tabContainer>
注：内容不许为空，为空将有异常发生
2221
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
