jquery easyui的使用
第一步下载jquery easyui 下载地址:http://www.jeasyui.com/download/index.php
第二步创建Java web项目
第三步导入相关的文件。。文件夹结构例如以下
- <link rel="stylesheet" type="text/css" href="easyui/themes/default/easyui.css">
- <link rel="stylesheet" type="text/css" href="easyui/themes/icon.css">
- <script type="text/javascript" src="easyui/jquery-1.7.2.min.js"></script>
- <script type="text/javascript" src="easyui/jquery.easyui.min.js"></script>
<link rel="stylesheet" type="text/css" href="easyui/themes/icon.css">
<script type="text/javascript" src="easyui/jquery.min.js"></script>
<script type="text/javascript" src="easyui/jquery.easyui.min.js"></script>
下载个jquery-easyui-1.3.0使用。把他导入到myeclipse10里。jquery-1.7.2.min.js报错。
解决的方法:
jqueryjQueryJQUERYJqueryJQueryjquery报错jsJSJsmyeclipseMyEclipseMyeclipse1、选中报错的jquery文件“jquery-1.2.6.min.js”。
2、右键选择 MyEclipse-->Exclude From Validation 。
3、再右键选择 MyEclipse-->Run Validation 就可以。
ui1的源代码:
<%@ 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>jquery easyui test 1</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">
-->
<link rel="stylesheet" type="text/css" href="easyui/themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="easyui/themes/icon.css">
<!-- <link rel="stylesheet" type="text/css" href="easyui/themes/icon.css"> -->
<!-- <link rel="stylesheet" type="text/css" href="easyui/demo.css"> -->
<script type="text/javascript" src="easyui/jquery.min.js"></script>
<script type="text/javascript" src="easyui/jquery.easyui.min.js"></script>
</head>
<body>
<h2>Basic Panel</h2>
<p>The panel is a container for other components or elements.</p>
<div style="margin:20px 0 10px 0;">
<a href="#" class="easyui-linkbutton" onclick="javascript:$('#p').panel('open')">Open</a>
<a href="#" class="easyui-linkbutton" onclick="javascript:$('#p').panel('close')">Close</a>
</div>
<div id="p" class="easyui-panel" title="Basic Panel" style="width:700px;height:200px;padding:10px;">
<p style="font-size:14px">jQuery EasyUI framework helps you build your web pages easily.</p>
<ul>
<li>easyui is a collection of user-interface plugin based on jQuery.</li>
<li>easyui provides essential functionality for building modem, interactive, javascript applications.</li>
<li>using easyui you don't need to write many javascript code, you usually defines user-interface by writing some HTML markup.</li>
<li>complete framework for HTML5 web page.</li>
<li>easyui save your time and scales while developing your products.</li>
<li>easyui is very easy but powerful.</li>
</ul>
</div>
<div id="p" class="easyui-panel" style="width:500px;height:200px;padding:10px;"
title="My Panel" iconCls="icon-save" collapsible="true">
The panel content
</div>
</body>
</html>
效果图:
相关文章
- JQuery利用sort对DOM元素进行排序
- abp(net core)+easyui+efcore实现仓储管理系统——ABP WebAPI与EasyUI结合增删改查之六(三十二)
- abp(net core)+easyui+efcore实现仓储管理系统——ABP WebAPI与EasyUI结合增删改查之五(三十一)
- abp(net core)+easyui+efcore实现仓储管理系统——ABP WebAPI与EasyUI结合增删改查之四(三十)
- abp(net core)+easyui+efcore实现仓储管理系统——ABP WebAPI与EasyUI结合增删改查之三(二十九)
- jQuery extend
- jQuery FileUpload doesn't trigger 'done'
- 史上最全的CSS hack方式一览 jQuery 图片轮播的代码分离 JQuery中的动画 C#中Trim()、TrimStart()、TrimEnd()的用法 marquee 标签的使用详情 js鼠标事件 js添加遮罩层 页面上通过地址栏传值时出现乱码的两种解决方法 ref和out的区别在c#中 总结
- 【Jquery】jQuery获取URL參数的两种方法
- 前端基础 -JQuery 删除节点
- [转]Spring3 MVC + jQuery easyUI 做的ajax版本用户管理
- jQuery插件开发全解析,类级别与对象级别开发
- jquery.validate使用详解
- jQuery可拖拽排序列表jquery-sortable-lists
- jquery.qrcode.js 插件生成二维码
- 《jQuery Cookbook中文版》——1.17 在不造成全局冲突的情况下使用$别名
- 《jQuery EasyUI开发指南》——第1章 认识jQuery EasyUI 1.1jQuery EasyUI介绍
- 《jQuery EasyUI开发指南》——1.6 新建Web Project
- 《jQuery Cookbook中文版》——1.7 返回破坏性修改之前的选择
- jquery.params.js,Jquery获取页面参数,js获取页面参数
- jquery easyui combotree获取值, combotree获取多个值
- Jquery EasyUI Combotree和 EasyUI tree展开所有父节点和获取完整路径
- Jquery EasyUI Combotree只能选择叶子节点且叶子节点有多选框
- Jquery EasyUI远程校验,Jquery EasyUI多个自定义校验,EasyUI自定义校验
- Jquery easyui 重置按钮,easyui 清空表单,Jquery easyui 重置表单
- jquery easyui textbox onblur事件,textbox blur事件无效解决方案
- jquery中Live方法不可用,Jquery中Live方法失效
- jquery.validate.js校验select2解决方案,Jquery插件select2校验解决方案
- jquery中attr和prop的区别
- Jquery为动态添加的未来元素绑定事件
- 简单jQuery实现选项框中列表项的选择
- 聊聊"jQuery is not defined"
- 使用Jquery+EasyUI进行框架项目开发案例解说之中的一个---员工管理源代码分享
- Jquery学习—jquery的事件
- jQuery与GridView控件结合示例