jQuery EasyUI是一款快速开发web程序的软件,这款软件是英文的,使用的时候不是很方便,虽然网络上有汉化版,但是并不适用于刚学习jQuery EasyUI 软件编程的朋友,本次给大家推荐的就是该软件的中文版使用说明书,一般刚学一个软件的时候看得最多的就是说明书了,非常适合中国的朋友使用,里面包括了jQuery EasyUI 基础、布局、菜单按钮编程、表单、Windows窗口、扩展程序等大量的教程以及常用的代码编程方式,无论是新手还是专业的编程人员都可以使用。
软件功能
文档
EasyUI每个组件的属性,方法和事件。用户可以很容易地扩展他们。
属性
所有的属性都定义在jQuery.fn.{plugin}.defaults里面。例如,对话框属性定义在jQuery.fn.dialog.defaults里面。
事件
所有的事件(回调函数)也都定义在jQuery.fn.{plugin}.defaults里面。
DataGrid(数据表格)
扩展自$.fn.panel.defaults。使用$.fn.datagrid.defaults重写默认值对象。
DataGrid以表格形式展示数据,并提供了丰富的选择、排序、分组和编辑数据的功能支持。DataGrid的设计用于缩短开发时间,并且使开发人员不需要具备特定的知识。它是轻量级的且功能丰富。单元格合并、多列标题、冻结列和页脚只是其中的一小部分功能
Tree(树)
使用$.fn.tree.defaults重写默认值对象。
树控件在web页面中一个将分层数据以树形结构进行显示。它提供用户展开、折叠、拖拽、编辑和异步加载等功能。
PropertyGrid(属性表格)
继承自$.fn.datagrid.defaults。使用$.fn.propertygrid.defaults重写默认值对象。
属性表格提供The propertygrid provide给用户浏览和编辑对象属性的一个接口。属性表格是一个行内可编辑数据表格。它使用起来相当简单。用户可以非常简单的创建一个分层的可编辑属性列表和表示任何数据类型的项。属性表格内建排序和分组功能。
方法
调用方法的语法:$('selector').plugin('method', parameter);
解释:
selector 是jQery对象选择器。
plugin 是插件的名称。
method 是相应插件现有的方法。
parameter 是参数对象,可以是一个对象、字符串等。
Messager(消息窗口)
使用$.messager.defaults重写默认值对象。
消息窗口提供了不同的消息框风格,包含alert(警告框), confirm(确认框), prompt(提示框), progress(进度框)等。所有的消息框都是异步的。用户可以在交互消息之后使用回调函数去处理结果或做一些自己需要处理的事情。
软件特色
Combo(自定义下拉框)
扩展自$.fn.validatebox.defaults。使用$.fn.combo.defaults重写默认值对象。
自定义下拉框显示一个可编辑的文本框和下拉面板在html页面。这是构建其他复杂的组合部件(如:combobox,combotree,combogrid等)之前需要构建的最基本的组件。
Tooltip(提示框)
使用$.fn.tooltip.defaults重写默认值对象。(译者注:1.3.3版中新增的plugin)
当用户将鼠标移动到元素上的时候,将会显示一个消息提示框。提示框的内容可以是页面中任何一个HTML元素或者通过Ajax发送后台请求以获取提示框内容。
TextBox(文本框)
扩展自$.fn.validatebox.defaults,使用$.fn.textbox.defaults重写默认值对象。(该组件自1.4版开始可用)
TextBox(文本框)是一个增强的输入字段组件, 它允许用户非常简单的创建一组表单。它是一个用于构建其他组合控件的基础组件,如:combo,databox、spinner等
PasswordBox(密码框)
扩展自$.fn.textbox.defaults,使用$.fn.passwordbox.defaults重写默认值对象。(该组件自1.5版开始可用)
该插件允许用户在具有更好交互功能的输入框中输入密码。 密码框会通过显示圆点的方式来保护您输入的密码文本,同时输入框中会提供一个眼睛的图标来通过点击的动作查看您输入的密码,来确保您输入的密码正确无误。
ComboBox(下拉列表框)
扩展自$.fn.combo.defaults。使用$.fn.combobox.defaults重写默认值对象。
下拉列表框显示一个可编辑文本框和下拉式列表,用户可以选择一个值或多个值。用户可以直接输入文本到列表顶部或选择一个或多个当前列表中的值。
ComboTree(树形下拉框)
扩展自$.fn.combo.defaults和$.fn.tree.defaults。使用$.fn.combotree.defaults重写默认值对象。
树形下拉框结合选择控件和下拉树控件。它与combobox(下拉列表框)类似,但是将下拉列表框的列表替换成了树形控件。该控件支持树状态复选框,方便多选操作。
使用方法
所有方法都定义在jQuery.fn.{plugin}.methods。每个方法都有2个参数:jq和param。第一个参数'jq'是必须的,这是指的jQuery对象。第二个参数'param'是指传入方法的实际参数。例如,为dialog组件扩展一个方法名为'mymove',代码如下:
现在你可以调用'mymove'方法将对话框移动到指定位置:
jQuery EasyUI 入门指南
下载程序库并导入EasyUI的CSS和Javascript文件到您的页面。
一旦你导入了EasyUI必须的文件,你就可以通过标记或Javascript定义一个EasyUI组件。例如:定义一个带可折叠功能的面板,你需要写的HTML代码如下:
当通过标记创建一个组件的时候,从EasyUI 1.3版开始可以用HTML5标准的'data-options'属性来改写上面的代码为:
下面的代码演示了如何创建一个组合框,并绑定onSelect事件。
Resizable(调整大小)
使用$.fn.resizable.defaults重写默认值对象。
使用案例
使用标签创建可变大小的窗口。
使用Javascript创建可变大小的窗口。
更新日志
Bug(修复)
combobox:修复在加载包含所选项数据的时候不会触发“onSelect”事件的BUG;
datagrid:修复在字段设置为一个空值的时候导致在某些情况下“updateRow”方法无法正常工作的BUG。
Improvement(改进)
一个label标签可以被关联到任意表单的字段上;
combobox:改进在下拉项中“select”和“unselect”的规则;
combobox:添加“limitToList”属性来限制只能输入在列表项中的内容;
combogrid:允许用户快速克隆组件;
form:添加“dirty”属性,允许用户只发送变更的字段内容;
form:添加“resetDirty”方法;
datagrid:允许用户在没有数据的时候显示一条消息(比如:无记录);
textbox:添加“label”、“labelWidth”、“labelPosition”和“labelAlign”属性;
spinner:添加“spinAlign”属性;
calendar:允许用户在日历组件上显示周数(今年的第几周);
window:添加“constrain”属性。
New Plugin(新组件)
passwordbox:该插件允许用户在具有更好交互功能的输入框中输入密码;
combotreegrid:该插件结合了combobox和treegrid组件。
∨ 展开