jQuery EasyUI 开源插件套装 完全替代ExtJS_jquery

前台开发,很多人喜欢用JQuery,但是在做后台管理系统,特别是企业管理系统,例如WEB进销存系统等,很多人都会选择ExtJS,因为ExtJS提供了非常多的UI界面,并且非常友好。

我要告诉大家,现在JQuery也有一个很好的UI插件了,几乎完全可以替代ExtJS,下面来看看对比:

 

上图是ExtJS和EasyUI的界面对比,是不是很类似呢,很强大呢? 呵呵~~

 

漂亮的消息弹出,支持遮罩效果。

 

这个效果也很酷~ 

更多的酷炫功能请看下方功能列表。。。

 Easy UI的使用也非常地简单:

复制代码 代码如下:

<script type="text/javascript" src="../jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="../jquery.easyui.min.js"></script>

与引用其它JQuery插件类似。具体使用可以参考官方地址:http://jquery-easyui.wikidot.com/tutorial

下面是Easy ui目前提供的所有插件功能:

Menu and Button
Create a simple menu
Create a Link Button
Create a Menu Button
Create a Split Button
Layout
Build border layout for Web Pages
Complex layout on Panel
Create Accordion
Create Tabs
Create XP style left panel
DataGrid
Convert a HTML table to DataGrid
Add a pagination to DataGrid
Get selected row data from DataGrid
Add a toolbar to DataGrid
Frozen columns for DataGrid
Dynamic change DataGrid columns
Formatting DataGrid columns
Add sorting to DataGrid
Create column groups in DataGrid
CheckBox select on DataGrid
Window
My first window
Custom window tools
Window and Layout
Create Dialog
Tree
Create Tree from markup
Create Async Tree
Append nodes to tree
Form
Submit a form with Ajax
Add ComboTree field to a form
Form Validation

用过ExtJS的朋友都知道,他与JQuery来比,ExtJS是比较臃肿的一个JS框架,JQuery它是一个公认的轻量级JS框架,而基于JQuery的Easy UI它能够完全胜任我们的基本开发需求,并且比ExtJS要轻量许多。

赶快去体验吧,一定会对你的工作有很大帮助的!
下载地址 jQuery EasyUI 常用UI组件

时间: 2024-10-22 01:58:18

jQuery EasyUI 开源插件套装 完全替代ExtJS_jquery的相关文章

JQuery爱好者们的福音:jQuery EasyUI 开源插件套装 完全替代ExtJS

前台开发,很多人喜欢用JQuery,但是在做后台管理系统,特别是企业管理系统,例如WEB进销存系统等,很多人都会选择ExtJS,因为ExtJS提供了非常多的UI界面,并且非常友好.   我要告诉大家,现在JQuery也有一个很好的UI插件了,几乎完全可以替代ExtJS,下面来看看对比:   上图是ExtJS和EasyUI的界面对比,是不是很类似呢,很强大呢? 呵呵~~     漂亮的消息弹出,支持遮罩效果.     这个效果也很酷~  更多的酷炫功能请看下方功能列表...    Easy UI的

jQuery Easyui快速入门教程_jquery

1.什么是JQuery EasyUI jQuery EasyUI是一组基于JQuery的UI插件集合,而JQueryEasyUI的目标就是帮助开发者更轻松的打造出功能丰富并且美观的UI界面.开发者不需要编写复杂的JavaScript,也不需要对css样式有深入的了解,开发者需要了解的只是一些简单的html标签. 2.学习jQuery EasyUI的条件 因为JQueryEasyUI是基于jQuery的UI库,所以,必须需要JQuery课程的基础. 3.JQuery EasyUI的特点 基于JQu

jquery.simple.tree插件 更简单,兼容性更好的无限树插件_jquery

效果如下: 选择: 拖拽: jquery.simple.tree.官网地址: http://news.kg/wp-content/uploads/tree/(貌似已经打不开),不过因为操作比较简单,所以我们暂且用之. 前面讲过jquery EasyUI Tree插件,简单易用,但经过测试仍有诸多缺点, 例如: 1.兼容IE8的AJAX有问题. 2.如果异步返回数据较慢,将可能导致加载失败. 3.我们只使用其中的Tree功能,但其体积实在有点庞大.... 而我们需要的是,兼容性好,异步,体积小(用

jQuery谷歌地图插件Maplace(图中附送如何攻击开源中国数据库)

jQuery谷歌地图插件Maplace 图中附送如何攻击开源中国数据库..   var P1 = [ { lat: 45.468945, lon: 45.73684365, title: 'Title', html: 'Content', zoom: 10, animation: google.maps.Animation.DROP } ]; var LocsA = [ { lat: 45.9, lon: 10.9, title: 'Title A1', html: '<h3>Content

基于MVC4+EasyUI的Web开发框架经验总结(1)-利用jQuery Tags Input 插件显示选择记录

最近花了不少时间在重构和进一步提炼我的Web开发框架上,力求在用户体验和界面设计方面,和Winform开发框架保持一致,而在Web上,我主要采用EasyUI的前端界面处理技术,走MVC的技术路线,在重构完善过程中,很多细节花费不少时间进行研究和提炼,一步步走过来,也积累了不少经验,本系列将主要介绍我在进一步完善我的Web框架基础上积累的经验进行分享,本随笔主要介绍利用jQuery Tags Input 插件显示选择记录. 我在利用jQuery Tags Input 插件之前,一直想找一个合适的J

jquery easy-ui使用datagrid插件,调用servlet没有反应,请帮忙看看,谢谢!

问题描述 ===============servlet配置================<servlet><servlet-name>myservlet</servlet-name><servlet-class>curve.GetDataServlet</servlet-class></servlet><servlet-mapping><servlet-name>myservlet</servlet-n

《jQuery EasyUI开发指南》——第1章 认识jQuery EasyUI 1.1jQuery EasyUI介绍

第1章 认识jQuery EasyUI 本章主要内容 jQuery EasyUI介绍 管理系统需求分析 建立数据库 选择开发工具 MyEclipse的语言配置 新建Web Project 安装Tomcat服务器 搭建SSH开发框架 搭建jQuery EasyUI开发环境 1.1 jQuery EasyUI介绍 作为一款开源前端插件集合,jQuery EasyUI已经非常强大了,跟EasyUI同时活跃在市场上的还有Bootstrap.Avalon等,可以说,这些前端插件各有各的好处.同时,学习这些

jquery easyui浅谈

jquery easyui首先在会在 jquery 对象下创建一个节点ui(所谓的命名空间),里面包含了自己定义的一些插件方法和自己的工具类,当然也像jquery 对象下创建一些对象,那么它是如何用查找到的jquery的对象调用到了ui节点下的方法呢,当时觉得很是不可思议,究其根本还是对js.jquery不够了解,js中对象的属性的都是以数组形式存得,jquery对象也一样,在jquery中有一个插件机制,插件方法会注册到$.fn 下,easyui 就是利用了这一点,它有一个工具包再注册插件时候

jquery手风琴特效插件

 这篇文章主要介绍了jquery手风琴特效插件,效果非常棒,需要的朋友可以参考下     手风琴效果是项目中使用频率较高的一种效果,原来项目一直都在用easyui的,临近年末,试着自己写了一个 css样式   代码如下: /* CSS Document */ body { margin: 0 auto; padding: 0 auto; font-size: 9pt; font-family: 微软雅黑, 宋体, Arial, Helvetica, Verdana, sans-serif; }