预览加载中，请您耐心等待几秒...

jQueryEasyUI1.3用法.pptx

预览
1/10
2/10
3/10
4/10
5/10
6/10
7/10
8/10
9/10
10/10

亲，该文档总共32页，到这已经超出免费预览范围，如果喜欢就直接下载吧～

下载提示 文本预览

如果您无法下载资料，请参考说明：

1、部分资料下载需要金币，请确保您的账户上有足够的金币

2、已购买过的文档，再次下载不重复扣费

3、资料包下载后请先用软件解压，在使用对应软件打开

1.1jQueryEasyUI简介Easyloader加载器 Draggable可拖动 Droppable可放置 Resizable可调整尺寸 Pagination分页 Searchbox搜索框 Progressbar进度条 Tooltip提示框 Panel面板 Tabs标签页/选项卡 Accordion折叠面板 Layout布局 Panel面板 1.使用标签创建控制面板 <divid="p"class="easyui-panel"title="MyPanel"style="width:500px;height:150px;padding:10px;background:#fafafa;"data-options="iconCls:'icon-save',closable:true,collapsible:true,minimizable:true,maximizable:true"> <p>panelcontent.</p> <p>panelcontent.</p> </div Panel面板 2.使用脚本创建控制面板 <divid="p"style="padding:10px;"> <p>panelcontent.</p> <p>panelcontent.</p> </div> $('#p').panel({ width:500, height:150, title:'MyPanel', tools:[{ iconCls:'icon-add', handler:function(){alert('new')} },{ iconCls:'icon-save', handler:function(){alert('save')} }] }); Tabs标签页/选项卡 1.使用HTML标签创建选项卡 <divid="tt"class="easyui-tabs"style="width:500px;height:250px;"> <divtitle="Tab1"style="padding:20px;display:none;"> tab1 </div> <divtitle="Tab2"closable="true"style="overflow:auto;padding:20px;display:none;"> tab2 </div> <divtitle="Tab3"iconCls="icon-reload"closable="true"style="padding:20px;display:none;"> tab3 </div> </div> Tabs标签页/选项卡 使用脚本创建选项卡 $('#tt').tabs({ border:false, onSelect:function(title){ alert(title+'isselected'); } }); Accordion折叠面板 使用html标签创建可伸缩面板，只须要对<div>标签引用'easyui-accordion'类。 <divid="aa"class="easyui-accordion"style="width:300px;height:200px;"> <divtitle="Title1"iconCls="icon-save"style="overflow:auto;padding:10px;"> <h3style="color:#0099FF;">AccordionforjQuery</h3> <p>AccordionisapartofeasyuiframeworkforjQuery. Itletsyoudefineyouraccordioncomponentonwebpagemoreeasily.</p> </div> <divtitle="Title2"iconCls="icon-reload"selected="true"style="padding:10px;"> content2 </div> <divtitle="Title3"> content3 </div> </div> Layout布局 使用HTML标签创建布局面板，只须要对<div>标签引用'easyui-layout'类。 <divid="cc"class="easyui-layout"style="width:600px;height:400px;"> <divregion="north"title="NorthTitle"split="true"style="height:100px;"></div> <divregion="south"title="SouthTitle"split="true"style="height:100px;"></div> <divregion="