jquery easyui 中文文档

合集下载

jQuery EasyUI API手册

[键入公司名称][键入文档标题] [键入文档副标题]龙士荣[选取日期]DocumentationEach component of easyui has properties, methods and events. Users can extend them easily.PropertiesThe properties is defined in jQuery.fn.{plugin}.defaults. For example, the dialog's properties is defined in jQuery.fn.dialog.defaults.EventsThe events(callback functions) is defined in jQuery.fn.{plugin}.defaults also.MethodsThe calling method syntax: $('selector').plugin('method', parameter);Where:∙selector is the jquery object selector.∙plugin is the plugin name.∙method is the existing method corresponding to the plugin.∙parameter is the parameter object, can be a object, string, ...The methods is defined in jQuery.fn.{plugin}.methods. Each method has two parameters: jq and param. The first parameter 'jq' is required, which refers to that jQuery object. The second parameter 'param' refers to the really parameter that pass through the method. For example, to extend a method named 'mymove' for the dialog component, the code looks like this:Now you can call 'mymove' method to move the dialog to specified position:Getting Started with jQuery EasyUIDownload the library and include EasyUI CSS and JavaScript files on your page.Once you've included the EasyUI necessary files, you can define an EasyUI component from markup or using JavaScript. For example, to define a panel with collapsible functionality, you can write the HTML code like this:2 / 81When creating a component from markup, the 'data-options' attribute can be used to support HTML5 compliant attribute names since version 1.3. So you can rewrite the code above as:The code below shows how to create a combobox that bind 'onSelect' event.1 Base1.1 Parser3 / 81UsagePropertiesEventsMethods1.2 EasyLoader UsageLoad EasyUI moduleLoad script from an absolute urlLoad script from relative urlProperties5 / 81Defined locales∙af∙bg∙ca∙cs∙cz∙da∙de∙en∙es∙fr∙nl∙tr∙zh_CN∙zh_TW EventsMethods1.3 DraggableOverride defaults with $.fn.draggable.defaults.Usage ExampleCreate a draggable element from markup.Create a draggable element using javascript.7 / 81Properties8 / 81EventsMethods1.4 DroppableOverride defaults with $.fn.droppable.defaults.Usage ExampleCreate a droppable area from markup.9 / 81Create a droppable area using javascript.PropertiesEventsMethods10 / 811.5 ResizableOverride defaults with $.fn.resizable.defaults.Usage ExampleCreate resizable object from markup.Create resizable object using javascript.Properties11 / 81EventsMethods12 / 811.6 PaginationOverride defaults with $.fn.pagination.defaults.The pagination allows the user to navigate data by page. It supports configurable options for page navigation and page length choices. The user can add customize buttons on right of pagination to enhance its functionality.DependencieslinkbuttonUsage ExampleCreate pagination from markup.Create pagination using javascript.13 / 81Let's create ajax pagination with panel and pagination plugins. When the user select a new page, the panel will display the corresponding content of specified page.The panel on top display the first page content by default. When the user navigate the page, the 'onSelectPage' event will be triggered, in which we call 'refresh' method for the content panel to load new page content with a new URL parameter.Properties14 / 8116 / 81EventsMethods1.7 SearchBoxExtend from $.fn.textbox.defaults. Override defaults with $.fn.searchbox.defaults.18 / 81The searchbox prompt the user to enter search value. It can combine a menu that allows the user to select different searching category. The searching action will be executed when the user press ENTER key or click the search button on the right of component.Dependencies∙textbox∙menubuttonUsage ExampleCreate SearchBox1. Create from markup. Add 'easyui-searchbox' class to <input/> markup.19 / 812. Create programatically.Properties20 / 81Methods21 / 811.8 ProgressBarOverride defaults with $.fn.progressbar.defaults.The progressbar provides a feedback of showing progress of an long-running operation. The progress can be updated to let the user know that some operation is currently executing.22 / 81DependenciesnoneUsage ExampleCreate ProgressBarThe ProgressBar component can be created from html markup or programatically. Creation from markup is even easier. Add 'easyui-progressbar' class to <div/> markup.Create ProgressBar using javascript.Get or Set ValueWe get the current value and set a new value for this component.PropertiesEventsMethods24 / 811.9 TooltipOverride defaults with $.fn.tooltip.defaults.When a user move the mouse pointer over an element, a tooltip message window appears to display additional information. The tooltip content can contain any html elements that come from the page or via ajax.Usage ExampleCreate Tooltip1. Create tooltip from markup, add 'easyui-tooltip' class to the element, no javascript code is needed.25 / 812. Create tooltip using javascript.Properties26 / 81EventsMethods27 / 812 Layout2.1 PanelOverride defaults with $.fn.panel.defaults.The panel is used as a container for other contents. It is the base component for building other components such as layout, tabs, accordion, etc. It also provides built-in collapsible, closable, maximizable and minimizable behavior and other customized behavior. Panels can be easily embedded into any position of web page.1 Usage ExampleCreate Panel1. Create Panel via markup28 / 81Creation from markup is even easier. Add 'easyui-panel' class to <div/> markup.2. Create Panel programaticallyLet's create panel with tools on top right.29 / 81Move PanelCall 'move' method to move panel to a new positionLoad ContentLet's load the panel content via ajax and show some message when loaded successfully.2 Properties30 / 8131 / 8132 / 8133 / 8134 / 813 Events35 / 814 Methods36 / 8137 / 812.2 TabsOverride defaults with $.fn.tabs.defaults.The tabs display a collection of panel. It shows only one tab panel at a time. Each tab panel has the header title and some mini button tools, including close button and other customized buttons.Dependencies∙panel∙linkbuttonUsage Example38 / 81Create tabs1. Create tabs via markupCreate tabs from markup is even easier, we don't need to write any JavaScript code. Remember to add 'easyui-tabs' class to <div> markup. Each tab panel is created via sub <div> markup, the usage is same as panel.2. Create tabs programaticallyNow we create tabs programatically, we catch the 'onSelect' event also.39 / 81Add new tab panelAdd a new tab panel with mini tools, the mini tools icon(8x8) is placed before the close button.Get the selected TabProperties40 / 8141 / 81Events43 / 81Methods44 / 8145 / 81Tab PanelThe tab panel properties is defined in panel component, below is some common properties.46 / 81Some added properties.2.1 AccordionOverride defaults with $.fn.accordion.defaults.The accordion allows you to provide multiple panels and display one or more at a time. Each panel has built-in support for expanding and collapsing. Clicking on a panel header to expand or collapse that panel body. The panel content can be loaded via ajax by specifying a 'href' property. Users can define a panel to be selected. If it is not specified, then the first panel is taken by default.Dependencies47 / 81panelUsage ExampleCreate AccordionCreate accordion via markup, add 'easyui-accordion' class to <div/> markup.We can change or recreate accordion later and modify some features.48 / 81Refresh Accordion Panel ContentCall 'getSelected' method to get the current panel and then we can call 'refresh' method of panel to load new content.Container OptionsPanel OptionsThe accordion panel options is inhirited from panel, below is the addition properties:49 / 81。

jquery+easyui培训文档

目录1Accordion（可折叠标签） (3)1.1实例 (3)1.2参数 (4)2DateBox（日期框） (4)2.1实例 (4)2.2参数 (7)2.3事件 (7)2.4方法 (7)3ComboBox(组合框) (7)3.1实例 (7)3.2参数 (9)3.3事件 (10)3.4方法 (10)4Dialog（对话框） (10)4.1实例 (10)4.2参数 (12)4.3事件 (13)4.4方法 (13)5Messager（提示框） (13)5.1实例 (13)5.2方法 (16)5.3扩展 (17)6NumberBox（数字框） (17)6.1实例 (17)6.2参数 (18)7ValidateBox（验证框） (18)7.1实例 (18)7.2参数 (20)7.3方法 (20)7.4扩展 (20)8Pagination（分页） (21)8.1实例 (21)8.2参数 (22)8.3事件 (23)9Window（窗口） (23)9.1实例 (23)9.2参数 (26)9.3事件 (26)9.4方法 (26)10Panel（面板） (26)10.1实例 (26)10.2参数 (28)10.3事件 (29)10.4方法 (29)11Tabs（标签） (30)11.1实例 (30)11.2参数 (32)11.3事件 (32)11.4方法 (33)11.5标签面板属性 (33)12Tree（树） (33)12.1实例 (33)12.2参数 (36)12.3事件 (37)12.4方法 (37)13Layout（布局） (38)13.1实例 (38)13.2参数 (39)13.3方法 (39)14Datagrid（数据表） (39)14.1实例 (40)14.2参数 (43)14.3Column参数 (44)14.4事件 (45)14.5方法 (46)1Accordion（可折叠标签）1.1实例1.1.1代码<html><head><meta http-equiv="Content-Type"content="text/html; charset=UTF-8"><title>jQuery EasyUI</title><link rel="stylesheet"type="text/css"href="../themes/default/easyui.css"><link rel="stylesheet"type="text/css"href="../themes/icon.css"><script type="text/javascript"src="../jquery-1.4.2.min.js"></script><script type="text/javascript"src="../jquery.easyui.min.js"></script><script type="text/javascript">$( function() {$('#aa').accordion( {width : 400,height : 200,fit : false});});</script></head><body><div id="aa"border="true"><div title="Title1"icon="icon-save" style="overflow: auto; padding: 10px;"> <h3style="color: #0099FF;">Accordion for jQuery</h3><p>Accordion is a part of easyui framework for jQuery. It lets you define your accordion component on web page more easily.</p></div><div title="Title2"icon="icon-reload"selected="true"style="padding: 10px;">content2</div><div title="Title3">content3</div></div></body></html>1.1.2效果图1.1.3 扩展实例html代码中<div id="aa"border="true">此行也可写成<div id="aa" class="easyui-accordion" style="width:300px;height:200px;" fit="false" border="false">，并且将js代码全部去掉，效果图是一样的。

jQuery EasyUI API 中文文档 - Tree树使用介绍

jQuery EasyUI API 中文文档 - Tree树使用介绍用 $.fn.tree.defaults 重写了 defaults。

依赖draggabledroppable用法Tree 能在 <ul> 元素里定义，此标记可以定义为叶节点和子节点。

下面是一个示例：复制代码代码如下:<ul id="tt"><li><span>Folder</span><ul><li><span>Sub Folder 1</span><ul><li><span><a href="#">File 11</a></span></li><li><span>File 12</span></li><li><span>File 13</span></li></ul></li><li><span>File 2</span></li><li><span>File 3</span></li></ul></li><li><span>File21</span></li></ul>Tree 也可以在一个空的 <ul> 元素里定义。

<ul id="tt"></ul>复制代码代码如下:$('#tt').tree({url:'tree_data.json'});树数据的格式（Tree data format）每个节点可以包含下列特性：id：节点的 id，它对于加载远程数据很重要。

jquery_easyui_cn文档

jquery_easyui_cn文档目录1 Accordion（可折叠标签） 21.1 实例 21.2 参数 32 DateBox（日期框） 42.1 实例 42.2 参数 62.3 事件 62.4 方法 63 ComboBox(组合框) 73.1 实例 73.2 参数 93.3 事件 93.4 方法 94 Dialog（对话框） 104.1 实例 104.2 参数 124.3 事件 124.4 方法 125 Messager（提示框） 125.1 实例 125.2 方法 155.3 扩展 166 NumberBox（数字框） 166.1 实例 166.2 参数 177 ValidateBox（验证框） 187.1 实例 187.2 参数 207.3 方法 207.4 扩展 208 Pagination（分页） 208.1 实例 208.2 参数 228.3 事件 239 Window（窗口） 23 9.1 实例 239.2 参数 259.3 事件 269.4 方法 2610 Panel（面板） 26 10.1 实例 2610.2 参数 2810.3 事件 2910.4 方法 2911 Tabs（标签） 3011.1 实例 3011.2 参数 3211.3 事件 3211.4 方法 3311.5 标签面板属性 3312 Tree（树） 3312.1 实例 3312.2 参数 3612.3 事件 3712.4 方法 3713 Layout（布局） 38 13.1 实例 3813.2 参数 3913.3 方法 3914 Datagrid（数据表） 39 14.1 实例 3914.2 参数 4314.3 Column参数 4414.4 事件 4514.5 方法 46Accordion（可折叠标签）实例代码$(function(){$(''#aa'').accordion({width:400,height:200,fit:false});});AccordionforjQueryAccordionisapartofeasyuiframeworkforjQuery.Itletsyoudefineyouraccordioncomponentonwebpagemoreeasily.style="padding:10px;">content2content3效果图1.1.3扩展实例html代码中此行也可写成，并且将js代码全部去掉，效果图是一样的。

jQuery EasyUI_DataGrid 数据表格 API 中文文档

当用户单击一个单元格时触发。
onDblClickCell
rowIndex, field, value
当用户双击一个单元格时触发。
onSortColumn
sort, order
当用户对一列进行排序时触发，参数包括：
sort：排序的列的字段名
order：排序的列的顺序
onResizeColumn
field, width
rowIndex：编辑行的索引，从0开始
rowData：编辑行对应的记录
onHeaderContextMenu
e, field
当datagrid的头部被右键单击时触发。
onRowContextMenu
e, rowIndex, rowData
当右键点击行时触发。
方法
名称
参数
说明
options
none
返回options对象。
post
nowrap
boolean
True就会把数据显示在一行里。
true
idField
string
标识字段。
null
url
string
从远程站点请求数据的URL。
null
loadMsg
string
当从远程站点加载数据时，显示的提示信息。
Processing, please wait …
pagination
b：第二个字段值。
undefined
editor
string,object
指编辑类型。当是string时指编辑类型，当object时包含两个特性：
type：string，编辑类型，可能的类型是：
text、textarea、checkbox、numberbox、validatebox、datebox、combobox、combotree。

jquery easyui 中文文档

jqueryeasyui中文帮助文档

jqueryeasyui中文帮助文档Base基础Documentation文档每个easyui组件都有特性（property）、方法（method）和事件（event），用户可以很容易地扩展它们。

特性特性在jQuery.fn.{plugin}.defaults里定义。

例如，dialog的特性在jQuery.fn.dialog.defaults里定义。

事件事件（回调函数）也在jQuery.fn.{plugin}.defaults里定义。

方法方法在jQuery.fn.{plugin}.methods里定义。

每个方法有两个参数：jq和param。

第一个参数'jq'是必须的，它是指jQuery对象。

第二个参数'param' 是指传递给方法的真正的参数。

例如，给dialog组件扩展一个名叫'mymove' 的方法，代码看起来就像这样：1. $.extend($.fn.dialog.methods, {2. mymove: function(jq, newposition){3. return jq.each(function(){4. $(this).dialog('move', newposition);5. });6. }7. });现在你可以调用'mymove'方法把dialog移动到一个指定的位置：1. $('#dd').dialog('mymove', {2. left: 200,3. top: 1004. });Parser 解析器1.$.parser.parse(); // 解析整个页面2.$.parser.parse('#cc'); // 解析某个具体节点特性事件EasyLoader 加载器用法1. easyloader.base = '../'; // 设置easyui的基本路径2. easyloader.load('messager', function(){ // 加载指定的模块3. $.messager.alert('Title', 'load ok');4. });定义的语言环境afbgcacsdadeenfrnlzh_CNzh_TW事件Draggable 可拖拽用$.fn.draggable.defaults重写默认的defaults。

jquery_easyui_详细说明文档资料讲解

j q u e r y_e a s y u i_详细说明文档目录div easyui-window ...................................................................................... window窗口样式 (3)div easyui-panel ................................................................................................................ 面板 (3)a easyui-linkbutton ....................................................................................... 链接类型的按钮 (4)input/textarea easyui-validatebox .............................................................................. 字段验证 (4)ul easyui-tree ........................................................................................................... 树形结构 (5)table easyui-datagrid ......................................................................................................... 表格 (6)div easyui-tabs ........................................................................................................... tab容器 (7)div menu-sep ....................................................................................................... 菜单分隔线 (8)a easyui-splitbutton ....................................................................................................... 菜单列 (8)div easyui-accordion ...................................................................................... 手风琴式下拉框 (8)select easyui-combobox ......................................................................................... 组合下拉框 (8)select easyui-combotree ........................................................................................ 组合树形框 (9)body[div] easyui-layout ..................................................................................................... 布局 (9)div easyui-menu ............................................................................................................... 菜单 (9)a easyui-menubutton ................................................................................................ 菜单按钮. (10)input easyui-numberbox ........................................................................................ 数字输入框. (10)window ............................................................................................................ window窗口. (10).tree ....................................................................................................................... 树形结构. (10).datagrid ......................................................................................................................... 表格. (10).combobox .......................................................................................................... 组合下拉框. (10).combotree ......................................................................................................... 组合树形框. (10).dialog ........................................................................................................................ 对话框. (10).draggable ................................................................................................... 可自由拖动的块. (11).linkbutton .............................................................................................................. 链式按钮. (11).messager ................................................................................................................... 消息框. (11).pagination .......................................................................................................... 页码工具条. (12)CSS类定义：div easyui-window window窗口样式属性如下：1)modal:是否生成模态窗口。

EasyUI中文API帮助说明文档

jQuery EasyUI中文帮助说明文档API版本：1.2.4jQuery EasyUI 框架帮助你轻松建立站点。

easyui是一个基于jquery的集成了各种用户界面的插件。

使用easyui你不需要写太多javascript代码，一般情况下你只需要使用一些html标记来定义用户接口。

easyui非常简单，但是功能非常强大。

基本语法解析使用方法属性事件方法语法解析使用方法属性事件方法可拖动使用$.fn.draggable.defaults 重载默认值。

使用方法属性名称类型描述默认值proxy （替代）string,function拖动时的替代元素，当被设置为'clone'时，将使用该元素的一个复制元素来作为替代元素。

如果指定了一个函数, 它将返回一个jquery 对象。

null revert （复原） boolean （布尔型）如果设置为true, 当拖动停止时元素将返回它的初始位置。

false cursor （指针） string （字符串）拖动时的CSS 指针。

move deltaX （水平number （数字）被拖动元素对应于当前指针的水平位置。

null事件方法拖动至容器使用$.fn.droppable.defaults重载默认值。

使用方法属性事件缩放使用$.fn.resizable.defaults重载默认值。

使用方法属性名称类型描述默认值disabled（禁止缩放）boolean（布尔型）如果设置为true将禁止缩放。

falsehandles（句柄）string（字符串）说明缩放的方向，'n'表示向上（北）,'e'表示向右（东）等。

n, e, s, w, ne, se,sw, nw, allminWidth（最小宽度）number（数字）缩放时所允许的最小宽度。

10minHeight（最小number（数缩放时所允许的最小高度。

10事件分页使用$.fn.pagination.defaults重载默认值。

jquery_easyui_中文API

目录1Accordion（可折叠标签） (3)1.1实例 (3)1.2参数 (4)2DateBox（日期框） (4)2.1实例 (4)2.2参数 (7)2.3事件 (7)2.4方法 (7)3ComboBox(组合框) (7)3.1实例 (7)3.2参数 (9)3.3事件 (10)3.4方法 (10)4Dialog（对话框） (10)4.1实例 (10)4.2参数 (12)4.3事件 (13)4.4方法 (13)5Messager（提示框） (13)5.1实例 (13)5.2方法 (16)5.3扩展 (17)6NumberBox（数字框） (17)6.1实例 (17)6.2参数 (18)7ValidateBox（验证框） (18)7.1实例 (18)7.2参数 (20)7.3方法 (20)7.4扩展 (21)8Pagination（分页） (21)8.1实例 (21)8.2参数 (23)8.3事件 (23)9Window（窗口） (23)9.1实例 (24)9.2参数 (26)9.3事件 (26)9.4方法 (26)10Panel（面板） (26)10.1实例 (27)10.2参数 (28)10.3事件 (29)10.4方法 (30)11Tabs（标签） (30)11.1实例 (30)11.2参数 (33)11.3事件 (33)11.4方法 (33)11.5标签面板属性 (33)12Tree（树） (34)12.1实例 (34)12.2参数 (37)12.3事件 (37)12.4方法 (38)13Layout（布局） (38)13.1实例 (38)13.2参数 (40)13.3方法 (40)14Datagrid（数据表） (40)14.1实例 (40)14.2参数 (44)14.3Column参数 (45)14.4事件 (46)14.5方法 (47)1Accordion（可折叠标签）1.1实例1.1.1代码<html><head><meta http-equiv="Content-Type"content="text/html; charset=UTF-8"><title>jQuery EasyUI</title><link rel="stylesheet"type="text/css"href="../themes/default/easyui.css"><link rel="stylesheet"type="text/css"href="../themes/icon.css"><script type="text/javascript"src="../jquery-1.4.2.min.js"></script><script type="text/javascript"src="../jquery.easyui.min.js"></script><script type="text/javascript">$( function() {$('#aa').accordion( {width : 400,height : 200,fit : false});});</script></head><body><div id="aa"border="true"><div title="Title1"icon="icon-save" style="overflow: auto; padding: 10px;"> <h3style="color: #0099FF;">Accordion for jQuery</h3><p>Accordion is a part of easyui framework for jQuery. It lets you define your accordion component on web page more easily.</p></div><div title="Title2"icon="icon-reload"selected="true"style="padding: 10px;">content2</div><div title="Title3">content3</div></div></body></html>1.1.2效果图1.1.3 扩展实例html代码中<div id="aa"border="true">此行也可写成<div id="aa" class="easyui-accordion" style="width:300px;height:200px;" fit="false" border="false">，并且将js代码全部去掉，效果图是一样的。

1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。

1.2参数1.2.1容器参数1.2.2面板参数可折叠标签面板继承自面板（panel）,许多属性定义在<div />标签里，下面的属性就是如此：2DateBox（日期框）2.1实例2.1.1代码<!DOCTYPE html PUBLIC"-//W3C//DTD HTML 4.01 Transitional//EN""/TR/html4/loose.dtd"><html><head><meta http-equiv="Content-Type"content="text/html; charset=gb2312"><title>jQuery EasyUI</title><link rel="stylesheet"type="text/css"href="../themes/default/easyui.css"><link rel="stylesheet"type="text/css"href="../themes/icon.css"><script type="text/javascript"src="../jquery-1.4.2.min.js"></script> <script type="text/javascript"src="../jquery.easyui.min.js"></script> <script>function disable() {$('#dd').datebox('disable');}function enable() {$('#dd').datebox('enable');}/*将Date/String类型,解析为String类型.传入String类型,则先解析为Date类型不正确的Date,返回 ''如果时间部分为0,则忽略,只返回日期部分.*/function formatDate(v) {if (v instanceof Date) {var y = v.getFullYear();var m = v.getMonth() + 1;var d = v.getDate();var h = v.getHours();var i = v.getMinutes();var s = v.getSeconds();var ms = v.getMilliseconds();if (ms > 0)return y + '-' + m + '-' + d + ' ' + h + ':' + i + ':' + s+ '.' + ms;if (h > 0 || i > 0 || s > 0)return y + '-' + m + '-' + d + ' ' + h + ':' + i + ':' + s;return y + '-' + m + '-' + d;}return'';}$( function() {$('#dd').datebox( {currentText : '今天',closeText : '关闭',disabled : false,required : true,missingMessage : '必填',formatter : formatDate});});</script></head><body><h1>DateBox</h1><div style="margin-bottom: 10px;"><a href="#"onclick= disable();>disable</a><a href="#"onclick=enable();>enable</a></div><input id="dd"></input></body></html>2.1.2效果图2.2参数2.3事件2.4方法3ComboBox(组合框)3.1实例3.1.1代码<html><head><meta http-equiv="Content-Type"content="text/html; charset=gb2312"> <title>jQuery EasyUI</title><link rel="stylesheet"type="text/css"href="../themes/default/easyui.css"><link rel="stylesheet"type="text/css"href="../themes/icon.css"><script type="text/javascript"src="../jquery-1.4.2.min.js"></script> <script type="text/javascript"src="../jquery.easyui.min.js"></script> <script>function loadData(){$('#cc').combobox({url:'combobox_data.json',//该文件内容在下面valueField:'id',textField:'text'});}function setValue(){$('#cc').combobox('setValue','2');}function getValue(){var val = $('#cc').combobox('getValue');alert(val);}function disable(){$('#cc').combobox('disable');}function enable(){$('#cc').combobox('enable');}$( function() {$('#cc').combobox( {width:150,listWidth:150,listHeight:100,//valuefield:'value',//textField:'text',//url:'combobox_data.json',editable:false});});</script></head><body><h1>ComboBox</h1><div style="margin-bottom: 10px;"><a href="#"onclick="loadData()">loadData</a><a href="#"onclick="setValue()">setValue</a><a href="#"onclick="getValue()">getValue</a><a href="#"onclick="disable()">disable</a><a href="#"onclick="enable()">enable</a></div><span>Options: </span><select id="cc"name="dept"required="true"><option value="">==请选择==</option><option value="0">苹果</option><option value="1">香蕉</option><option value="2">鸭梨</option><option value="3">西瓜</option><option value="4">芒果</option> </select></body></html>combobox_data.json内容：[{"id":1,"text":"text1"},{"id":2,"text":"text2"},{"id":3,"text":"text3","selected":true},{"id":4,"text":"text4"},{"id":5,"text":"text5"}]3.1.2效果图3.2参数3.3事件3.4方法4Dialog（对话框）4.1实例4.1.1代码<html><head><meta http-equiv="Content-Type"content="text/html; charset=gb2312"> <title>jQuery EasyUI</title><link rel="stylesheet"type="text/css"href="../themes/default/easyui.css"><link rel="stylesheet"type="text/css"href="../themes/icon.css"><script type="text/javascript"src="../jquery-1.4.2.min.js"></script> <script type="text/javascript"src="../jquery.easyui.min.js"></script> <script>$(function(){$('#dd').dialog({title:'对话框',collapsible:true,minimizable:true,maximizable:true,resizable:true,toolbar:[{text:'Add',iconCls:'icon-add',handler:function(){alert('add');}},'-',{text:'Save',iconCls:'icon-save',handler:function(){alert('save');}}],buttons:[{text:'Ok',iconCls:'icon-ok',handler:function(){alert('ok');}},{text:'Cancel',handler:function(){$('#dd').dialog('close');}}]});});function open1(){$('#dd').dialog('open');}function close1(){$('#dd').dialog('close');}</script></head><body><h1>Dialog</h1><div style="margin-bottom: 10px;"><a href="#"onclick="open1()">open1</a><a href="#"onclick="close1()">close1</a></div><div id="dd"icon="icon-save"style="padding: 5px; width: 400px; height: 200px;"> <p>dialog content.</p><p>dialog content.</p><p>dialog content.</p><p>dialog content.</p><p>dialog content.</p><p>dialog content.</p><p>dialog content.</p><p>dialog content.</p></div></body></html>4.1.2效果图4.2参数4.3事件Dialog的事件和窗口(Window)的事件相同。