jQuery EasyUI 入门必看


Posted in Javascript onJune 03, 2016

学习要点:

1.什么是 jQuery EasyUI

2.学习 jQuery EasyUI 的条件 3.jQuery EasyUI 的功能和优势

4.其他的 UI 插件

5.是否兼容低版本 IE

6.下载及运行 jQuery EasyUI

在正式了解 jQuery EasyUI 之前,我们先了解一下什么是 jQuery EasyUI。它的学习条件、市场上的同类产品、所支持的浏览器等。然后配置运行 jQuery EasyUI。

一.什么是 jQuery EasyUI

jQuery EasyUI 是一组基于 jQuery 的 UI 插件集合,而 jQuery EasyUI 的目标就是帮助Web 开发者更轻松的打造出功能丰富并且美观的 UI 界面。开发者不需要编写复杂的JavaScript,也不需要对 css 样式有深入的了解,开发者需要了解的只有一些简单的 html 标签。

官方网站:http://www.jeasyui.com

jQuery EasyUI 入门必看

二.学习 jQuery EasyUI 的条件

因为 jQuery EasyUI 是基于jQuery 的 UI 库,所以,必须需要 jQuery 课程的基础。而jQuery需要那些基础,直接参考 jQuery 课程 66 课第一节内容。 

三.jQuery EasyUI 的特点 

1.基于 jquery 用户界面插件的集合;

2.为一些当前用于交互的 js 应用提供必要的功能;

3.使用 EasyUI 你不需要写很多的 javascript 代码,通常只需要写 HTML 标记来定义用户界面即可;

4.支持 HTML5;

5.开发产品时可节省时间和资源;

6.简单,但很强大;

7.支持扩展,可根据自己的需求扩展控件;

8.目前各项不足正已版本递增的方式不断完善;

9.源代码加密,商业版付费

四.其他的 UI 插件

除了 jQuery EasyUI 之外,还有 DWZ(国产的,基于 jQuery 的 UI 插件),还有一个独立的 ExtJS 的 UI 插件。

五.是否兼容低版本 IE

我们将要使用最新的 jQuery EasyUI 版本:1.3.5,它里面自带的 jQuery 版本是 2.0。也 就是说,不再支持 IE6,7,8 这三款浏览器了。如果你必须要使用,可以选择更低版本。当然,我们已经不在建议兼容这些版本了。最基本的原因是:jQuery EasyUI 很少用于 Web 应用的前台页面,一般用于后台的 UI 或者企业级应用的 UI(较为重)。那么使用这些功能的用户不会那么鱼龙混杂,一般会被要求使用更高级的浏览器,所以没有必要向下兼容。

PS:有部分用户坚持使用 IE6,声称未来会一直使用 IE6。那么我建议放弃这样的用户,因为 IE6 性能低下、内存泄漏、不支持高级特性,成倍的开发成本。如果失去这样的用户,就面临停工,那么死也要会死的痛快点,而如果活下来,那么也会非常愉快。可是,总是迎合这些低质量用户,你就像得了慢性病一样,每天折磨着,痛苦地慢慢死去,就算公司倒闭了,那些客户还不停电话说,系统有问题,你还要不停解释公司倒闭了,技术人员全跑了。

六.下载及运行 jQuery EasyUI

下载最新的 jQuery EasyUI1.3.5 版本,然后解压后直接使用即可。 

//HTML5 调用 jQuery EasyUI

<!DOCTYPE html>
<html>
  <head>
    <title>jQuery Easy UI</title>
    <meta charset="UTF-8" />
    <script type="text/javascript" src="easyui/jquery.min.js"></script>
    <script type="text/javascript" src="easyui/jquery.easyui.min.js"></script>
    <script type="text/javascript" src="easyui/locale/easyui-lang-zh_CN.js" ></script>
    <link rel="stylesheet" type="text/css" href="easyui/themes/default/easyui.css" />
    <link rel="stylesheet" type="text/css" href="easyui/themes/icon.css" />
  </head>
  <body>
    <div class="easyui-dialog" style="width:400px;height:200px"
    data-options="title:'My Dialog',collapsible:true,iconCls:'icon-ok',onOpen:function(){}">
      dialog content.
    </div>
  </body>
</html>

PS:虽然我们用了 HTML5 的格式,但所有标签还是沿用 XHTML 的,并为真正涉及到HTML5 的标签和 CSS。

以上这篇jQuery EasyUI 入门必看就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
javascript学习笔记(七)利用javascript来创建和存储cookie
Apr 08 Javascript
js完美实现@提到好友特效(兼容各大浏览器)
Mar 16 Javascript
AngularJS基础学习笔记之控制器
May 10 Javascript
学习JavaScript鼠标响应事件
Dec 25 Javascript
JavaScript实现跑马灯抽奖活动实例代码解析与优化(二)
Feb 16 Javascript
Javascript6中字符串的四个新用法分享
Sep 11 Javascript
JavaScript学习笔记整理_简单实现枚举类型,扑克牌应用
Sep 19 Javascript
微信小程序Server端环境配置详解(SSL, Nginx HTTPS,TLS 1.2 升级)
Jan 12 Javascript
addEventListener()与removeEventListener()解析
Apr 20 Javascript
angular 实现的输入框数字千分位及保留几位小数点功能示例
Jun 19 Javascript
vue引用外部JS的两种种方法
Jan 28 Javascript
Vue CLI3移动端适配(px2rem或postcss-plugin-px2rem)
Apr 27 Javascript
创建基于Bootstrap的下拉菜单的DropDownList的JQuery插件
Jun 02 #Javascript
jQuery Ajax页面局部加载方法汇总
Jun 02 #Javascript
jQuery中Ajax全局事件引用方式及各个事件(全局/局部)执行顺序
Jun 02 #Javascript
jQuery Ajax 全局调用封装实例代码详解
Jun 02 #Javascript
jQuery页面加载初始化的3种方法(推荐)
Jun 02 #Javascript
Jquery和JS获取ul中li标签的实现方法
Jun 02 #Javascript
Jquery获取第一个子元素简单实例
Jun 02 #Javascript
You might like
PHP 5.6.11中CURL模块问题的解决方法
2016/08/08 PHP
PHP 返回数组后处理方法(开户成功后弹窗提示)
2017/07/03 PHP
thinkPHP5框架auth权限控制类与用法示例
2018/06/12 PHP
取得一定长度的内容,处理中文
2006/12/20 Javascript
javascript简易缓动插件(源码打包)
2012/02/16 Javascript
JavaScript获取路径设计源码
2014/05/22 Javascript
JavaScript及jquey实现多个数组的合并操作
2014/09/06 Javascript
浅谈javascript的Array.prototype.slice.call
2015/08/31 Javascript
js从数组中删除指定值(不是指定位置)的元素实现代码
2016/09/13 Javascript
微信js-sdk上传与下载图片接口用法示例
2016/10/12 Javascript
微信小程序 progress组件详解及实例代码
2016/10/25 Javascript
jQuery实现倒计时重新发送短信验证码功能示例
2017/01/12 Javascript
详解react-redux插件入门
2018/04/19 Javascript
vue awesome swiper异步加载数据出现的bug问题
2018/07/03 Javascript
angular 服务的单例模式(依赖注入模式下)详解
2018/10/22 Javascript
Vue实现图书管理案例
2021/01/20 Vue.js
Python def函数的定义、使用及参数传递实现代码
2014/08/10 Python
利用QT写一个极简单的图形化Python闹钟程序
2015/04/07 Python
解读Python中degrees()方法的使用
2015/05/18 Python
Python中标准模块importlib详解
2017/04/16 Python
python+matplotlib绘制3D条形图实例代码
2018/01/17 Python
python+selenium实现自动化百度搜索关键词
2019/06/03 Python
pytorch 实现tensor与numpy数组转换
2019/12/27 Python
Python多分支if语句的使用
2020/09/03 Python
美国购买和销售礼品卡平台:Raise
2017/01/13 全球购物
建筑工程专业学生的自我评价
2013/12/25 职场文书
机械设计及其自动化求职推荐信
2014/02/17 职场文书
年会搞笑主持词
2014/03/27 职场文书
文明演讲稿范文
2014/05/12 职场文书
珍惜资源保护环境的建议书
2014/05/14 职场文书
大学生找工作求职信
2014/07/09 职场文书
2014公安机关纪律作风整顿思想汇报
2014/09/13 职场文书
大学生职业生涯规划大赛作品(精品)
2014/09/17 职场文书
质检员工作总结2015
2015/04/25 职场文书
详解thinkphp的Auth类认证
2021/05/28 PHP
制作能在nginx和IIS中使用的ssl证书
2021/06/21 Servers