jquery easyui 的特点以及好处,我认为是可以结合html标签和js代码来开发页面,符合以前的开发习惯。并且在页面布局上更加清晰。
html代码和easyui结合的方式:
<div class="easyui-layout" style="width:400px;height:200px;">
<div region="west" split="true" title="Navigator" style="width:150px;" border="true">
<p style="padding:5px;margin:0;">Select language:</p>
<ul>
<li><a href="javascript:void(0)" onclick="showpage('java.html')">Java</a></li>
<li><a href="javascript:void(0)" onclick="showpage('cshape.html')">C#</a></li>
<li><a href="javascript:void(0)" onclick="showpage('vb.html')">VB</a></li>
<li><a href="javascript:void(0)" onclick="showpage('erlang.html')">Erlang</a></li>
</ul>
</div>
<div id="content" region="center" title="Language" href="java.html" style="padding:5px;">
</div>
</div>
实际运行的结果:
可以看到jquery easyui把我们自己的代码添加了很多的class,还有div。
下面来记录所有的属性的用处。
title:layout panel的标题。(这个不说也知道)。
region:英文翻译是——地区;范围;部位。这里就是面板位于页面的哪个地方。它的值有north, south, east, west, center。
border:边框,默认值为 true。呵呵,这个如果改成false了,那么这个panel就没有边框了。
split:默认false,设置面板是否可以被改变大小。true和false的区别除了是否可以改变大小以外,false的情况下,两个面板之间的空隙也会小一点。
iconCls:用来设置面板的header的图标。
href:(还没用过,待以后学习之后,在添加)

- 大小: 90.2 KB
分享到:
相关推荐
《jQuery EasyUI 中文版 API》是针对JavaScript框架jQuery的一款扩展库——jQuery EasyUI的官方中文文档,以CHM(Microsoft HTML Help)格式提供。这个API文档详细介绍了如何使用jQuery EasyUI来创建交互式、功能...
标题“jquery-easyui-1.5.4”表明我们将探讨的是该框架的一个特定版本——1.5.4。这个版本包含了对先前功能的优化和新特性的引入,为开发者提供了更强大的工具箱。 在描述中,“jquery-easyui-1.5.4”没有提供额外...
在标题“jquery-easyui-1.3.4.rar”中,我们看到的是jQuery EasyUI的一个特定版本——1.3.4。这个版本可能包含了该框架在2014年左右的状态,因为EasyUI的版本更新较为频繁,每个版本都可能引入新的功能、修复已知...
在标题“jquery-easyui-1.2”中,我们聚焦的是该框架的一个特定版本——1.2。这个版本在当时因其稳定性和丰富的功能而备受青睐,对于初学者和经验丰富的开发者来说都是一个很好的学习和实践平台。 jQuery EasyUI 的...
《jQuery EasyUI 1.5.1:轻松构建高效用户界面》 jQuery EasyUI 是一个基于 jQuery 的轻量级框架,它提供了一系列的组件和插件,帮助开发者快速构建功能丰富的用户界面。在这个版本——1.5.1 中,我们看到了一个...
本示例"Jquery-EasyUi-demo"是EasyUI的一个小演示项目,主要展示了如何在实际应用中实现基本的数据操作功能——增删改查。 EasyUI 的核心在于它的组件库,这些组件包括数据网格(datagrid)、对话框(dialog)、...
jQuery easyui是一款基于jQuery的前端框架,提供了丰富的UI组件,而easyui的布局组件是一个非常重要的功能,它可以帮助开发者快速构建出复杂的页面布局。在本文中,我们将详细介绍easyui的布局组件如何实现基本布局...
标题中提到的“easyui简单的增删改查范例”,指的是一个使用easyui框架来实现基本的数据库操作——增加、删除、修改和查询(CRUD)功能的应用实例。这种范例在web开发中非常常见,是学习和掌握easyui进行页面交互...
- 页面布局:学习如何使用`<div class="easyui-layout">`进行页面布局,理解north、south、east、west、center等区域的设置。 2. **组件使用** - 数据表格(datagrid):掌握数据表格的创建,包括列定义、数据...
EasyUI是一个基于jQuery的用户界面插件集合。它提供了各种UI组件,使得开发者能够快速地构建出丰富的Web应用程序界面。EasyUI不仅简化了前端开发流程,还提高了开发效率。在本篇文章中,我们将深入探讨如何使用...
本文将详细介绍一个基于JQuery+EasyUI技术栈的员工管理系统案例——员工管理源码分享。 #### 二、技术背景 ##### JQuery JQuery 是一款优秀的 JavaScript 库,它简化了 HTML 文档遍历、事件处理、动画以及 Ajax ...
在本主题中,我们将深入探讨一个实用的后台管理框架——EasyUI,以及与登录界面和后台管理界面相关的知识点。 EasyUI 是一个基于 jQuery 的前端 UI 框架,它提供了丰富的组件和样式,帮助开发者快速构建美观且功能...