web项目中引入jquery easyui

最新推荐文章于 2021-12-31 22:04:59 发布

转载最新推荐文章于 2021-12-31 22:04:59 发布 · 131 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/manmanlu/p/7158700.html

本文介绍如何在项目中引入jQuery EasyUI框架，通过简单的步骤实现炫酷的用户界面效果。提供具体实例代码，展示如何创建对话框等组件。

jQuery easyui是一个基于jquery的用户界面插件集合，可以做出各种炫酷页面效果，大中型项目都可以使用些框架，非常好用，而且它有中文网，提供了大量的demo.下面我们看怎么将它引入到项目中

一：下载地址

http://www.jeasyui.com/download/index.PHP

二：下载解压，将下面红圈中的考到项目的webapp下面，因为它提供了说明文档，demo，这些不需要考到项目中

三：页面引入下面几个文件即可使用jquery easyui的的所有功能了

也可以将这个放到一个公共的页面中，因为所有页面都要引用这四句话。其它页面引用这个公共页面即可

<%@ include file="./commonpage/easyuisupport.jsp" %>

来源：http://blog.youkuaiyun.com/whh743/article/details/53809793

实例：

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">

<title>My JSP '01.jsp' starting page</title>

<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">


<script type="text/javascript" src="${pageContext.request.contextPath}/jquery-easyui-1.5.2/jquery.min.js"></script>

<script type="text/javascript" src="${pageContext.request.contextPath}/jquery-easyui-1.5.2/jquery.easyui.min.js"></script>

<script type="text/javascript" src="${pageContext.request.contextPath}/jquery-easyui-1.5.2/locale/easyui-lang-zh_CN.js"></script>

<link rel="stylesheet" href="${pageContext.request.contextPath}/jquery-easyui-1.5.2/themes/default/easyui.css" type="text/css"/>

<link rel="stylesheet" href="${pageContext.request.contextPath}/jquery-easyui-1.5.2/themes/icon.css" type="text/css"/>

ps:jquery引入路径解释：jquery/jquery-1.8.3.min.js以当前页面test.jsp为坐标在当前文件夹中查找，由于test.jsp和jquery文件夹都在webroot目录下所以不需要

'/',如果加'/'意思是从项目根目录查找

参考：http://blog.youkuaiyun.com/luofeixiongsix/article/details/49882925

转载于:https://www.cnblogs.com/manmanlu/p/7158700.html