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

一：下载地址

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

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

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

<link rel="stylesheet" type="text/css" href="<c:url value="/themes/default/easyui.css"/>">
<link rel="stylesheet" type="text/css" href="<c:url value="/themes/icon.css"/>">
<script type="text/JavaScript" src="<c:url value="/jquery.min.js"/>"></script>
<script type="text/javascript" src="<c:url value="/jquery.easyui.min.js"/>"></script>

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

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

来源：http://blog.csdn.net/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">
<!--
<link rel="stylesheet" type="text/css" href="styles.css">
-->
<!-- 引入JQuery -->
<script type="text/javascript" src="${pageContext.request.contextPath}/jquery-easyui-1.5.2/jquery.min.js"></script>
<!-- 引入EasyUI -->
<script type="text/javascript" src="${pageContext.request.contextPath}/jquery-easyui-1.5.2/jquery.easyui.min.js"></script>
<!-- 引入EasyUI的中文国际化js，让EasyUI支持中文 -->
<script type="text/javascript" src="${pageContext.request.contextPath}/jquery-easyui-1.5.2/locale/easyui-lang-zh_CN.js"></script>
<!-- 引入EasyUI的样式文件-->
<link rel="stylesheet" href="${pageContext.request.contextPath}/jquery-easyui-1.5.2/themes/default/easyui.css" type="text/css"/>
<!-- 引入EasyUI的图标样式文件-->
<link rel="stylesheet" href="${pageContext.request.contextPath}/jquery-easyui-1.5.2/themes/icon.css" type="text/css"/>

<script type="text/javascript">
$(function(){
//console.info($('#dd2'));
/*使用JavaScript动态创建EasyUI的Dialog的步骤：
1、定义一个div，并给div指定一个id
2、使用Jquery选择器选中该div，然后调用dialog()方法就可以创建EasyUI的Dialog
*/
$('#dd2').dialog();//使用默认的参数创建EasyUI的Dialog
//使用自定义参数创建EasyUI的Dialog
$('#dd3').dialog({
title: '使用JavaScript创建的Dialog',
width: 400,
height: 200,
closed: false,
cache: false,
modal: true
});
});
</script>

</head>

<body>
This is my JSP page. <br>

<div class="easyui-dialog" id="dd1" title="EasyUI Dialog" style="width: 500px;height: 300px;">
Hello World!
</div>
<div id="dd2">Dialog Content</div>
<div id="dd3">Dialog Content</div>
</body>
</html>

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

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

参考：http://blog.csdn.net/luofeixiongsix/article/details/49882925

web项目中引入jquery easyui的更多相关文章

  1. 在vue项目中引入jquery

    在vue项目中引入jquerycnpm install jquery --save在main.js中引入,加入下面这行代码:import 'jquery'注:有些项目是按需加载的,在main.js里面 ...

  2. 在Web工程中引入Jquery插件报错解决方案

    在学习Jquery插件的时候,遇到一个问题就是新建web工程后在WebRoot下引入Jquery插件的时候报错,不知道为什么好纠结,但是项目能正常运行,后来找到解决方案,在这里给大家分享一下. 解决方 ...

  3. java web项目中引入spring

    自己动手实践了一次,发生中间出了一下问题,现整理出来,供参考. Step1: 新建一个java web项目 Step2:下载spring的jar包http://repo.spring.io/libs- ...

  4. vue-cli3.0以上项目中引入jquery的方法

    这里配置的是vue-cli3.0引入jquery的方法,不是vue-cli2.0的配置方法 一.安装jquery npm install jquery --save 二.在vue.config.js ...

  5. Angular项目中引入jQuery

    npm install --save jquery npm install @types/jquery --save 在对应的组件中引入 import * as $ from "jquery ...

  6. 如何在Vue项目中引入jQuery?

    假设你的项目由vue-cli初始化 (e.g. vue init webpack my-project). 在你的vue项目目录下执行: npm install jquery --save-dev 打 ...

  7. vue-cli3项目中引入jquery 以及如何引进bootstrap

    1.安装jquery npm install jquery --save 2.或则在package.json中指定版本号,然后运行npm install命令 "dependencies&qu ...

  8. 非WEB项目中引入Hibernate Validator

    前言: 网上一些朋友分享了关于hibernate-validator的使用方法,但是不是缺少关联库信息,就是提供的参考代码中缺少自定类. 希望我这一篇博客能够让你顺利的跑出预期的结果. 如果有错,可以 ...

  9. Java项目在jsp页面中引入jquery框架的步骤

    环境:在Java  web项目中引入juqery框架 工具:MyEclipse8.5 [步骤如下] A:新建一个Java web项目TestJquery,在WebRoot目录下创建一个jquery文件 ...

随机推荐

  1. 极路由安装SS，SSR，搬运，侵权删除

    打开路由器的开发者模式 使用SSH,登录到路由器后台 复制以下代码,粘贴即可 cd /tmp $ echo "127.0.0.1 hiwifiss.ml" > /etc/ho ...

  2. 循环（while、for)

    写重复的代码是程序员最不耻的行为,那么如何做到不用写重复代码又能让程序重复一段代码多次呢,循环语句就派上用场拉…… 一.while 循环 # while 语法结构 while 条件: 执行代码.... ...

  3. Dialogue between Jack and Rose【jack 和 Rose的对话】

    Dialogue between Jack and Rose Rose : It's getting quiet. 越来越安静了 Jack : It's gonna take a couple of ...

  4. Spark性能优化：开发调优篇

    1.前言 在大数据计算领域,Spark已经成为了越来越流行.越来越受欢迎的计算平台之一.Spark的功能涵盖了大数据领域的离线批处理.SQL类处理.流式/实时计算.机器学习.图计算等各种不同类型的计算 ...

  5. 文件的特殊权限（SUID,SGID,SBIT）

    文件的一般权限:r w x  对应 421  文件的特殊权限:SUID SGID SBIT对应 421  文件的隐藏权限:chattr设置隐藏权限,lsattr查看文件的隐藏权限. 文件访问控制列表: ...

  6. Redis实现之对象（四）

    类型检查与命令多态 Redis中用于操作键的命令基本上可以分为两种类型:其中一种命令可以对任何类型的键执行,比如DEL命令.EXPIRE命令.RENAME命令.TYPE命令.OBJECT命令等.举个栗 ...

  7. laravel5.2总结--本地化以及常量的使用

    1.本地化 Laravel 的本地化功能提供方便的方法来获取多语言的字符串,让你的网站可以简单的支持多语言. 语言包存放在 resources/lang 文件夹的文件里.每一个子目录应该对应一种语言 ...

  8. 53、listview、expandableListview如何选中时保持高亮？

    一.listView被选中后保持高亮 70down voteaccepted To hold the color of listview item when you press it, include ...

  9. Python-S9—Day86-ORM项目实战之会议室预定相关

    01 会议室预定1 02 会议室预定2 03 会议室预定3 04 会议室预定4 05 会议室预定5 06 会议室预定6 01 会议室预定1 1.1 项目的架构目录: 1.2 使用Pycharm创建Dj ...

  10. [oldboy-django][4python面试]有关csrf跨站伪造请求攻击

    1 csrf定义 - csrf定义:Cross Site Request Forgery,跨站请求伪造 举例来说: 网站A伪造了一个图片链接: <a href="http://www. ...