JSP 中集成JQuery 插件的实用方法
来源:互联网 发布:乐乎城市青年社区北苑 编辑:程序博客网 时间:2024/06/07 12:39
当你在做显示层的时候,JSP中可能需要集成这样那样的框架,如JQuery 的各种插件, 又或许是其他的prototype 等插件,这时你就需要导入多个JS、CSS文件,一个插件可能还不止一个JS、CSS文件,这时文件头都是各种JS、CSS标签。这个还不打紧,万一你要卸载某个插件,这时你不得不再去找这个插件加载了哪些文件,着实麻烦,现在教你一个简单方法,就是用 tag 标签。
这里用集成JQuery插件为例:
1. 首先在WEB-INF下新建一个tags目录,专门存放各种插件;
2. 其次在tags目录下新建jquery,存放jquery插件的tag,并新建相关tag,
tag的内容就是插件需要调用的JS、CSS文件:
jquery.tag:
- <%@ tag pageEncoding="utf-8"%>
- <script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery/jquery-1.6.2.min.js"></script>
<%@ tag pageEncoding="utf-8"%><script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery/jquery-1.6.2.min.js"></script>
jquery.easyui.tag
- <%@ tag import="com.zte.ecc.util.Config" %>
- <%@ tag pageEncoding="utf-8"%>
- <link media="all" type="text/css" rel="stylesheet" href="${pageContext.request.contextPath}/js/jquery/easyui/themes/default/easyui.css"/>
- <link media="all" type="text/css" rel="stylesheet" href="${pageContext.request.contextPath}/js/jquery/easyui/themes/icon.css"/>
- <script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery/easyui/jquery.easyui.min.js?ver=<%=Config.getVERSION()%>"></script>
- <script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery/easyui/jquery.easyui.extend.js"></script>
<%@ tag import="com.zte.ecc.util.Config" %><%@ tag pageEncoding="utf-8"%><link media="all" type="text/css" rel="stylesheet" href="${pageContext.request.contextPath}/js/jquery/easyui/themes/default/easyui.css"/><link media="all" type="text/css" rel="stylesheet" href="${pageContext.request.contextPath}/js/jquery/easyui/themes/icon.css"/><script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery/easyui/jquery.easyui.min.js?ver=<%=Config.getVERSION()%>"></script><script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery/easyui/jquery.easyui.extend.js"></script>tip:还可以导入JAVA类,动态指定版本号。
...此处省略其他的tag,有多少插件就建多少tag。
如图所示;
3. 最后, JSP 调用JQuery插件
第一步:建立一个taglib标签,指定标签指向的目录:
- <%@ taglib prefix="jquery" tagdir="/WEB-INF/tags/jquery" %>
<%@ taglib prefix="jquery" tagdir="/WEB-INF/tags/jquery" %>
第二步:调用taglib标签:
在<head></head>标签之间加入即可:
- <jquery:jquery></jquery:jquery>
- <jquery:jquery.easyui></jquery:jquery.easyui>
<jquery:jquery></jquery:jquery><jquery:jquery.easyui></jquery:jquery.easyui>
有多少个插件就以:jquery:tag文件名称 形式的标签调用.
如要导入JQuery 的 artdialog 插件,就加入<jquery:jquery.artdialog></jquery:jquery.artdialog>
查看一下JSP执行后的源代码,发现这些JS 等文件都已经加载进来了。
0 0
- JSP 中集成JQuery 插件的实用方法
- JSP 中集成JQuery 插件的实用方法
- jQuery poshytip 插件的简单实用方法
- jquery 项目中实用的小插件
- jquery实用的插件
- 实用的jQuery插件
- Jsp中Uploadify插件的使用(jQuery上传插件)
- JSP中Uploadify插件的使用(jQuery上传插件)
- jquery中操作数组非常实用的方法
- jquery的一些实用方法
- RCP程序中集成其他插件的配置方法
- jquery插件jtip的实用修改
- 实用的 jquery 弹出窗口 插件winbox
- 18 个最新实用的 jQuery 插件
- 实用的jQuery显示密码小插件
- 精美实用的jQuery插件精选
- 15个超级实用的jQuery插件
- 简单实用的jQuery Tooltip提示插件
- 【POJ3159】Candies 裸的pqspfa模版题
- 黑马程序员-day16Map集合及Map扩展
- NGUI 资源下载与教程专区
- 差之毫厘,谬以千里
- java 深入分析Java ClassLoader原理(实践操作)
- JSP 中集成JQuery 插件的实用方法
- HDOJ 题目1024 Max Sum Plus Plus(动态规划,不想交子段最大和)
- 迷宫深度优先搜索 找出一条可行路径
- 【Python】网络爬虫
- 开博
- Sort List
- python urllib
- SSH三大框架的工作原理及流程
- 比较好的博客