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 setTimeout和setInterval的使用方法 说明
Mar 25 Javascript
js 模拟气泡屏保效果代码
Jul 10 Javascript
理解Javascript_15_作用域分配与变量访问规则,再送个闭包
Oct 20 Javascript
js实现运动logo图片效果及运动元素对象sportBox使用方法
Dec 25 Javascript
谷歌浏览器不支持showModalDialog模态对话框的解决方法
Sep 22 Javascript
javascript框架设计之浏览器的嗅探和特征侦测
Jun 23 Javascript
Bootstrap导航条可点击和鼠标悬停显示下拉菜单的实现代码
Jun 23 Javascript
用js实现简单算法的实例代码
Sep 24 Javascript
JavaScript表单验证开发
Nov 23 Javascript
swiper 自动图片无限轮播实现代码
May 21 Javascript
微信实现自动跳转到用其他浏览器打开指定APP下载
Feb 15 Javascript
详解JavaScript中new操作符的解析和实现
Sep 04 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
function.inc.php超越php
2006/12/09 PHP
php array_push()数组函数:将一个或多个单元压入数组的末尾(入栈)
2011/07/12 PHP
Thinkphp框架使用list_to_tree 实现无限级分类列出所有节点示例
2020/04/04 PHP
JavaScript中的私有成员
2006/09/18 Javascript
禁止你的左键复制实用技巧
2013/01/04 Javascript
jquery获取对象的方法足以应付常见的各种类型的对象
2014/05/14 Javascript
seaJs的模块定义和模块加载浅析
2014/06/06 Javascript
javascript比较两个日期的先后示例代码
2014/12/31 Javascript
Javascript通过overflow控制列表闭合与展开的方法
2015/05/15 Javascript
jQuery实现的放大镜效果示例
2016/09/13 Javascript
文件上传的几个示例分享【推荐】
2016/12/16 Javascript
jQuery实现图片上传预览效果功能完整实例【测试可用】
2018/05/28 jQuery
Vue中div contenteditable 的光标定位方法
2018/08/25 Javascript
React Hooks 实现和由来以及解决的问题详解
2020/01/17 Javascript
一文读懂vue动态属性数据绑定(v-bind指令)
2020/07/20 Javascript
[29:16]完美世界DOTA2联赛决赛日 Inki vs LBZS 第三场 11.08
2020/11/10 DOTA
详细解析Python中__init__()方法的高级应用
2015/05/11 Python
Python实现的自定义多线程多进程类示例
2018/03/23 Python
使用python读取txt文件的内容,并删除重复的行数方法
2018/04/18 Python
python实现括号匹配的思路详解
2018/08/23 Python
Python封装原理与实现方法详解
2018/08/28 Python
python 异或加密字符串的实例
2018/10/14 Python
解决在pycharm中显示额外的 figure 窗口问题
2019/01/15 Python
python抖音表白程序源代码
2019/04/07 Python
使用Python和Scribus创建一个RGB立方体的方法
2019/07/17 Python
Python爬虫解析网页的4种方式实例及原理解析
2019/12/30 Python
Tensorflow 多线程设置方式
2020/02/06 Python
Python实现企业微信机器人每天定时发消息实例
2020/02/25 Python
Python3 hashlib密码散列算法原理详解
2020/03/30 Python
Python利用Pillow(PIL)库实现验证码图片的全过程
2020/10/04 Python
HTML5调用手机摄像头拍照的实现思路及代码
2014/06/15 HTML / CSS
美国体育用品商店:Academy Sports + Outdoors
2020/01/04 全球购物
中学自我评价
2014/01/31 职场文书
《与象共舞》教学反思
2014/02/24 职场文书
带香烟到学校抽的检讨书
2014/09/25 职场文书
2014大学生学生会工作总结
2014/12/19 职场文书