步骤一:
下载jakarta-taglibs-standard-1.1.2.zip(在Weblogic中必须下载1.0版http://jakarta.apache.org/site/downloads/downloads_taglibs-standard-1.0.cgi)
解压jakarta-taglibs-standard-1.1.2.zip,将解压后lib中的standard.jar和jstl.jar文件拷贝到\WEB-INF\lib\
将tld下的所有文件拷贝到"\WEB-INF\tlds"下
步骤二:
web.xml中配置jstl标签,一下是jstl1.0的配置,(1.1中包含15个文件,1.0中包含8个文件)
<taglib>
<taglib-uri>http://java.sun.com/jstl/fmt</taglib-uri>
<taglib-location>/WEB-INF/tlds/fmt.tld</taglib-location>
</taglib>
<taglib>
<taglib-uri>http://java.sun.com/jstl/fmt-rt</taglib-uri>
<taglib-location>/WEB-INF/tlds/fmt-rt.tld</taglib-location>
</taglib>
<taglib>
<taglib-uri>http://java.sun.com/jstl/core</taglib-uri>
<taglib-location>/WEB-INF/tlds/c.tld</taglib-location>
</taglib>
<taglib>
<taglib-uri>http://java.sun.com/jstl/core-rt</taglib-uri>
<taglib-location>/WEB-INF/tlds/c-rt.tld</taglib-location>
</taglib>
<taglib>
<taglib-uri>http://java.sun.com/jstl/sql</taglib-uri>
<taglib-location>/WEB-INF/tlds/sql.tld</taglib-location>
</taglib>
<taglib>
<taglib-uri>http://java.sun.com/jstl/sql-rt</taglib-uri>
<taglib-location>/WEB-INF/tlds/sql-rt.tld</taglib-location>
</taglib>
<taglib>
<taglib-uri>http://java.sun.com/jstl/x</taglib-uri>
<taglib-location>/WEB-INF/tlds/x.tld</taglib-location>
</taglib>
<taglib>
<taglib-uri>http://java.sun.com/jstl/x-rt</taglib-uri>
<taglib-location>/WEB-INF/tlds/x-rt.tld</taglib-location>
</taglib>
如果版本比较高,那么如下配置:
<?xml version="1.0" encoding="UTF-8"?>
<web-app version="2.5" xmlns="http://java.sun.com/xml/ns/javaee"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://java.sun.com/xml/ns/javaee
http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd">
<jsp-config>
<taglib>
<taglib-uri>http://java.sun.com/jstl/fmt</taglib-uri>
<taglib-location>/WEB-INF/tld/fmt.tld</taglib-location>
</taglib>
<taglib>
<taglib-uri>http://java.sun.com/jstl/fmt-1_0</taglib-uri>
<taglib-location>/WEB-INF/tld/fmt-1_0.tld</taglib-location>
</taglib>
<taglib>
<taglib-uri>http://java.sun.com/jstl/fmt-1_0-rt</taglib-uri>
<taglib-location>
/WEB-INF/tld/fmt-1_0-rt.tld
</taglib-location>
</taglib>
<taglib>
<taglib-uri>http://java.sun.com/jstl/core</taglib-uri>
<taglib-location>/WEB-INF/tld/c.tld</taglib-location>
</taglib>
<taglib>
<taglib-uri>
http://java.sun.com/jstl/core-1_0-rt
</taglib-uri>
<taglib-location>/WEB-INF/tld/c-1_0-rt.tld</taglib-location>
</taglib>
<taglib>
<taglib-uri>http://java.sun.com/jstl/core-1_0</taglib-uri>
<taglib-location>/WEB-INF/tld/c-1_0.tld</taglib-location>
</taglib>
<taglib>
<taglib-uri>http://java.sun.com/jstl/sql</taglib-uri>
<taglib-location>/WEB-INF/tld/sql.tld</taglib-location>
</taglib>
<taglib>
<taglib-uri>http://java.sun.com/jstl/sql-1_0</taglib-uri>
<taglib-location>/WEB-INF/tld/sql-1_0.tld</taglib-location>
</taglib>
<taglib>
<taglib-uri>http://java.sun.com/jstl/sql-1_0-rt</taglib-uri>
<taglib-location>
/WEB-INF/tld/sql-1_0-rt.tld
</taglib-location>
</taglib>
<taglib>
<taglib-uri>http://java.sun.com/jstl/x</taglib-uri>
<taglib-location>/WEB-INF/tld/x.tld</taglib-location>
</taglib>
<taglib>
<taglib-uri>http://java.sun.com/jstl/x-1_0</taglib-uri>
<taglib-location>/WEB-INF/tld/x-1_0.tld</taglib-location>
</taglib>
<taglib>
<taglib-uri>http://java.sun.com/jstl/x-1_0-rt</taglib-uri>
<taglib-location>/WEB-INF/tld/x-1_0-rt.tld</taglib-location>
</taglib>
<taglib>
<taglib-uri>http://java.sun.com/jstl/fn</taglib-uri>
<taglib-location>/WEB-INF/tld/fn.tld</taglib-location>
</taglib>
<taglib>
<taglib-uri>
http://java.sun.com/jstl/permittedTaglibs
</taglib-uri>
<taglib-location>
/WEB-INF/tld/permittedTaglibs.tld
</taglib-location>
</taglib>
<taglib>
<taglib-uri>http://java.sun.com/jstl/scriptfree</taglib-uri>
<taglib-location>
/WEB-INF/tld/scriptfree.tld
</taglib-location>
</taglib>
</jsp-config>
<welcome-file-list>
<welcome-file>index.jsp</welcome-file>
</welcome-file-list>
</web-app>
步骤三:
下载ditchnet-tabs-taglib.jar,官方网站为:http://ditchnet.org/tabs/,然后将下载的jar文件拷贝到web工程中(\WEB-INF\lib\ 下)
步骤四:
到web工程所在的目录将工程的只读型去掉,使其变成可写,原因是因为ditchnet-tabs-taglib.jar在工程编译的时候会在工程目录下创建一些需要的文件到工程下。
步骤五:在jsp页面中加入<%@ taglib prefix="tab" uri="http://ditchnet.org/jsp-tabs-taglib"%>便可以 在jsp页面中使用,如下示例:
<%@ page contentType="text/html" language="java" pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="tab" uri="http://ditchnet.org/jsp-tabs-taglib"%>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<tab:tabConfig />
<title>测试你的第一个使用到JSTL 的网页</title>
<script>
function myListener(evt) {
var selectedTabPane = evt.getTabPane(); // HTMLDivElement reference to
var selectedTab = evt.getTab(); // HTMLDivElement reference to
var tabContainer = evt.getTabContainer(); // HTMLDivElement reference to
//doSomethingInteresting(selectedTabPane,selectedTab,tabContainer);
}
</script>
</head>
<body>
<tab:tabContainer id="foo-bar-container" jsTabListener="myListener">
<tab:tabPane id="foo" tabTitle="Foo!">
Foo is cool!
</tab:tabPane>
<tab:tabPane id="bar" tabTitle="Bar!">
<c:out value="Bar is cooler!" />
</tab:tabPane>
<tab:tabLink href="http://www.baidu.com" selectedTabPaneId="foo">
百度
</tab:tabLink>
</tab:tabContainer>
<div>
<tab:prevTabButton tabContainerId="foo-bar-container">PREV</tab:prevTabButton>
<tab:nextTabButton tabContainerId="foo-bar-container">NEXT</tab:nextTabButton>
</div>
<tab:tabContainer id="next-prev-container2" skin="invisible">
<tab:tabPane id="pane2-1" tabTitle="One">1. Here is tab One.</tab:tabPane>
<tab:tabPane id="pane2-2" tabTitle="Two">2. This is tab Two.</tab:tabPane>
<tab:tabPane id="pane2-3" tabTitle="Three">3. Finally, tab Three.</tab:tabPane>
</tab:tabContainer>
<div>
<tab:prevTabButton tabContainerId="next-prev-container2">PREV</tab:prevTabButton>
<tab:nextTabButton tabContainerId="next-prev-container2">NEXT</tab:nextTabButton>
</div>
</body>
</html>
步骤六:
启动服务器,然后访问页面,可是发现tab并没有出来,原因是因为样式并没有加入进来。进入tomcat下webapp目录下,可以看见
org.ditchnet.taglib的目录,点击进去可以看见包含的js、css以及images,
在jsp页面中加入以下语句
<script type="text/javascript" src="/org.ditchnet.taglib/tabs.js"></script>
<link rel="stylesheet" href="/org.ditchnet.taglib/tabstyle.jsp" type="text/css"></link>
重启服务器,然后访问,即可。
步骤七:
如果重启后发现tab还是没有出来,那么可以进行如下检查
1、检查web.xml中的web-app是不是2.4以上的,不包含2.4,为什么要检查这个,原因是因为2.5不支持jstl,而工程中的js何css中大多使用的是jstl来实现
所以这里要将其修改成2.4版本的,或者自行修改js、css,然后在使用自己修改后的
2、检查jstl是否加入进来,如果没有加入进来那么加入jstl后在使用。
分享到:
相关推荐
在IT行业中,JSP(JavaServer Pages)是一种用于创建动态网页的技术,它允许开发者将Java代码嵌入到HTML页面中,以实现服务器端的逻辑处理。"漂亮的JSP TAB选项卡"是一个专为提高用户体验而设计的组件,它在网页上以...
在Tab切换中,JSP主要处理用户交互逻辑,如根据用户的点击事件改变Tab的选中状态,以及加载或显示相应页面的内容。可以使用JavaScript或者jQuery库来实现这些功能。例如,通过JavaScript的DOM操作获取和修改元素的...
导入到项目中,通过特定的标签语法,可以在JSP页面中轻松创建和管理Tab。 - 文件`MyPlugins_fix_0_1.zip`可能是针对某个前端框架(如Bootstrap)的插件更新,用于修复或增强Tab功能。安装并应用此插件,可以提升Tab...
1. **HTML结构**:创建Tab的HTML基础结构,通常包括一个包含多个li元素的ul列表,每个li代表一个Tab,同时在页面上放置一个div用于显示分页内容。 2. **CSS样式**:定义Tab的默认样式,如边框、背景色、字体等,...
创建Tab结构** 首先,我们需要在HTML中设置一个容器,比如`<div id="tabs-container">`,并在其中创建各个标签页。每个标签页可以用`<li>`元素表示,并通过点击事件监听器绑定切换行为。对应的页面内容可以放在...
DITCHNET JSP TAB 标签是用于在JavaServer Pages(JSP)中创建美观、易用的选项卡式布局的库。这个标签库提供了一种简洁的方式来组织页面内容,使得用户可以方便地切换不同的视图,提高了用户体验。在本文中,我们将...
同时,JSP自定义标签可以封装这些复杂逻辑,使得在JSP页面上只需简单地插入标签就能创建出这样的菜单。 "jsp标签"是JSP的一种扩展机制,允许开发者创建自己的标签库,类似于HTML标签,但可以执行更复杂的逻辑。...
script方式是通过动态创建一个script标签并插入到页面中,从而请求外部页面的JavaScript文件。被加载的JavaScript文件中,应包含可以操作DOM的代码,将外部页面的内容加载到指定位置。这种方式比较少见,但它可以...
在实际应用中,结合以上知识点,开发者可以创建出美观且功能丰富的页面切换效果。记得在编写代码时遵循语义化HTML,合理使用Bootstrap提供的预定义样式,以保持代码的可读性和维护性。同时,适当地利用CSS和...
在IT行业中,浏览器的Tab效果是一种常见的用户界面设计,它模仿了浏览器标签页的功能,让用户在同一个窗口内轻松切换不同的内容区域。这种效果在网页应用、桌面应用甚至移动应用中都得到了广泛的应用,提升了用户...
首先,我们需要在HTML中创建一个包含多个Tab面板的结构。每个Tab是一个`<li>`元素,作为导航链接,而对应的面板内容则放在隐藏的`<div>`中。例如: ```html <li class="tab active" data-target="tab1">Tab 1 ...
`navbar.html`和`nav.html`可能是导航栏组件,而`tab.html`可能用于创建可切换的选项卡界面,`page.html`可能是一个通用的页面框架,用于封装共有的头部、底部和侧边栏等内容。 通过整合这些组件和模式,开发者可以...
这里的问题是关于如何使用Ajax提交数据到后台的JSP页面,并在处理完数据后进行页面跳转。我们将详细探讨这个问题以及相关的知识点。 首先,我们看`logincheck.jsp`页面中的代码,它接收通过Ajax传递的参数: ```...
当用户请求JSP页面时,服务器会执行其中的Java代码并生成HTML响应返回给客户端。 接着,我们关注JavaScript部分。JS是一种轻量级的解释型编程语言,主要用于增强网页的交互性。在这个选项卡实现中,我们将利用JS来...
Tab标签则是组织和展示多页面内容的有效方式,它可以将复杂的信息分门别类地放在不同的标签页中,用户只需点击相应的标签就能切换到对应的内容。这种设计减少了屏幕空间的占用,提高了界面的可读性和导航效率。在...
在本项目中,我们关注的是如何使用JavaScript来实现鼠标单击和鼠标滑过触发的tab标签页功能,这在许多现代网页设计中是非常常见的元素。 首先,让我们了解一下JavaScript中的事件处理。在JavaScript中,事件是用户...
在jQuery EasyUI中,`<div class="easyui-tabs">`是创建Tab页的基本元素。每个Tab页是一个`<div>`,其中包含着对应的页面内容。通过`href`属性,我们可以指向外部HTML文件或者使用`<iframe>`嵌入内容。Tab页支持多种...
6. JSP Tab Library集成:学习如何在JSP环境中引入ASP.NET组件,实现跨技术栈的页面设计和功能实现。 7. 开发工具:熟悉Visual Studio IDE,以及如何使用它来开发和调试ASP.NET应用。 8. 部署和性能优化:掌握ASP...
在JSP页面中,可以通过以下方式引用并初始化CKEditor: ```html <textarea cols="80" id="content" name="fileUpload"></textarea> CKEDITOR.replace('content'); ``` 这段代码创建了一个`textarea`元素,并使用...
【JavaScript相册(带Tab选项卡切换)(图).rar】是一个使用JavaScript实现的相册应用,具备Tab选项卡切换功能。JavaScript是一种广泛使用的客户端脚本语言,用于增强网页的交互性。在这个项目中,开发者可能使用了...