博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
学习 easyui 之一:easyloader 分析与使用
阅读量:6833 次
发布时间:2019-06-26

本文共 1620 字,大约阅读时间需要 5 分钟。

使用脚本库总要加载一大堆的样式表和脚本文件,在 easyui 中,除了可以使用通常的方式加载之外,还提供了使用 easyloader 加载的方式。

这个组件主要是为了按需加载组件而诞生。什么情况下使用它呢?
  1. 你觉得一次性导入 easyui 的核心 min js 和 css 太大
  2. 你只用到 easyui 的其中几个组件
  3. 你想使用其中的一个组件,但是你又不知道这个组件依赖了那些组件。
如果你有以上三中情况,那么推荐你使用easyLoader。它可以帮你解决这些问题。

easyloader 用来帮助我们自动加载所需的脚本文件和样式文件,这样,我们只需要在页面中引用 jquery 脚本 和 easyloader 脚本,easyloader 就可以帮助我们分析模块的依赖关系,先加载依赖项。模块加载好了会调用parse模块来解析页面。把class是easyui开头的标签都转化成 easyui的控件。

下面我们,以使用 messager 模块为例,使用 easyloader 加载所需的模块。

我们的页面可以简单的仅仅写入下面的内容。注意,并不需要通常的样式表和一大堆的脚本引用。

    
弹出提示框

注意看!只有 jquery 的脚本和 easyloader 的脚本,完全没有一大堆的样式和其他脚本文件。

load 用来使用代码来说明需要加载的模块,这是在 easyloader 中定义的一个函数,函数的第一个参数为准备加载的模块名称,第二个参数为加载成功之后的回调函数。这里用来提示已经加载成功。

load 加载的模块有两种格式,即可以是一个字符串表示的单个模块,也可以是一个字符串的数组,同时加载多个模块。

//name有两种,一种是string ,一种是string array,这样一次可以加载多个plugin,都是调用add方法进行添加  if (typeof name == 'string') {    add(name);} else {    for (var i = 0; i < name.length; i++) {        add(name[i]);    }}

easyloader.load 还有一个别名 using 定义在 window 对象上,如下所示:

window.using = easyloader.load;

所以,加载的代码也可以这样写。

using("messager", function () {    alert("加载成功!");});

加载成功之后,我们就可以在代码中使用已经加载的模块了。

页面中还使用 class 说明了一个按钮,这里使用了 class="easyui-linkbutton",easyloader 还可以帮助我们解析元素中的特殊类名,直接就在页面中使用过的模块。

easyloader 会在它所在文件夹中,寻找 plugins 子文件夹中的脚本,和 themes 文件夹中的样式表。所以需要保证文件保存在正确的位置。

不过,easyloader 还提供了一个 base 属性,用来指定寻找插件和脚本的起点。

// jquery-easyui的根目录,在加载easyloader时,会自动根据你放置的位置而改变  base:'.',

除了 base , 还有几个重要的属性

base:'.',//该属性是为了加载js,记录文件夹路径的  theme:'default', //默认主题  css:true,    locale:null,

比如,希望使用中文语言包,则可以如下使用。你会看到提示框的按钮中的文字已经从 Ok 转换为了 "确定"。

easyloader.locale = "zh_CN";using("messager", function () {    alert("加载成功!");});

转载地址:http://hntkl.baihongyu.com/

你可能感兴趣的文章
ubuntu ufw使用规则
查看>>
SCCM 2007r2 操作系统播发故障处理案例三
查看>>
Linux网站架构系列之Apache----进阶篇
查看>>
Cisco ASA Failover配置实例 ZZ
查看>>
网络防火墙的配置与管理
查看>>
【桌面虚拟化】之五PCoIP
查看>>
游侠原创:安全狗“服云”深度评测!
查看>>
Linux内核高性能优化【生产环境实例】
查看>>
Windows Server 2016 和Windows 10的中Hyper-V虚拟机生产检查点
查看>>
Expression Blend使用笔刷
查看>>
思科交换机端口安全
查看>>
Silverlight C# 游戏开发:L6 3D摄像机
查看>>
XML和XMLSocket(一) -- XML的基础知识
查看>>
[强烈推荐]ORACLE SQL:经典查询练手第四篇(不懂装懂,永世饭桶!)
查看>>
Struts知识问答
查看>>
MongoDB实战(4)MapReduce
查看>>
FTP自动化上传的Shell脚本
查看>>
【C++11 并发编程教程 - Part 3 : 锁的进阶与条件变量(bill译)】
查看>>
换Vista啦
查看>>
jsp 教程(一)
查看>>