首页
所有分类
TAGS
文字工具 EMOJI BIBLE
编程 Javascript

jQuery组件easyui基本布局实现代码

Posted in Javascript onAugust 25, 2016

本文实例为大家分享了

<!DOCTYPE html>
<html>
<head>
 <meta charset="UTF-8">
 <title>Basic Layout - jQuery EasyUI Demo</title>
 <link rel="stylesheet" type="text/css" href="../themes/default/easyui.css">
 <link rel="stylesheet" type="text/css" href="../themes/icon.css">
 <link rel="stylesheet" type="text/css" href="demo.css">
 <script type="text/javascript" src="../jquery.min.js"></script>
 <script type="text/javascript" src="../jquery.easyui.min.js"></script>
</head>
<body>
 <h2>基本布局</h2>
 <p>布局包括北，南，东，西，中间，部分</p>
 <div style="margin:20px 0;"></div>
 <div class="easyui-layout" style="width:700px;height:350px;">
 <div data-options="region:'north'" style="height:50px"></div>
 <div data-options="region:'south',split:true" style="height:50px;"></div>
 <div data-options="region:'east',split:true" title="东" style="width:100px;"></div>
 <div data-options="region:'west',split:true" title="西" style="width:100px;"></div>
 <div data-options="region:'center',title:'Main Title',iconCls:'icon-ok'">
  <table class="easyui-datagrid"
   data-options="url:'datagrid_data1.json',method:'get',border:false,singleSelect:true,fit:true,fitColumns:true">
  <thead>
   <tr>
   <th data-options="field:'itemid'" width="80">Item ID</th>
   <th data-options="field:'productid'" width="100">Product ID</th>
   <th data-options="field:'listprice',align:'right'" width="80">List Price</th>
   <th data-options="field:'unitcost',align:'right'" width="80">Unit Cost</th>
   <th data-options="field:'attr1'" width="150">Attribute</th>
   <th data-options="field:'status',align:'center'" width="60">Status</th>
   </tr>
  </thead>
  </table>
 </div>
 </div>

</body>
</html>

效果图：

jQuery组件easyui基本布局实现代码

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持三水点靠木。

jQuery组件easyui基本布局实现代码

- Author -

lijiao

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐
一个简单的Ext.XTemplate的实例代码
Mar 18 Javascript
日历查询的算法 如何计算某一天是星期几
Dec 12 Javascript
JavaScript中的函数的两种定义方式和函数变量赋值
May 12 Javascript
javascript面向对象特性代码实例
Jun 12 Javascript
jQuery左侧大图右侧小图焦点图幻灯切换代码分享
Aug 19 Javascript
js中利用cookie实现记住密码功能
Aug 20 Javascript
SeaJS中use函数用法实例分析
Oct 10 Javascript
Angular使用动态加载组件方法实现Dialog的示例
May 11 Javascript
Bootstrap Table中的多选框删除功能
Jul 15 Javascript
webpack4 SCSS提取和懒加载的示例
Sep 03 Javascript
vue 中使用 watch 出现了如下的报错的原因分析
May 21 Javascript
AI小程序之语音听写来了，十分钟掌握百度大脑语音听写全攻略
Mar 13 Javascript
select隐藏选中值对应的id,显示其它id的简单实现方法
Aug 25 #Javascript
Js得到radiobuttonlist选中值的两种方法(推荐)
Aug 25 #Javascript
总结JavaScript的正则与其他语言的不同之处
Aug 25 #Javascript
js判断radiobuttonlist的选中值显示/隐藏其它模块的实现方法
Aug 25 #Javascript
jQuery实用小技巧_输入框文字获取和失去焦点的简单实例
Aug 25 #Javascript
JS实现图片延迟加载并淡入淡出效果的简单方法
Aug 25 #Javascript
JavaScript中闭包之浅析解读(必看篇)
Aug 25 #Javascript
mounted(1) 脚手架(2) create(1) el-table(1) 子查询(1) TableField(1) set(1) frozenset(1) Next.js(1) Mybatis-Plus(3)
You might like
PHP中使用GD库创建圆形饼图的例子
2014/11/19 PHP
ThinkPHP实现非标准名称数据表快速创建模型的方法
2014/11/29 PHP
php简单实现多字节字符串翻转的方法
2015/03/31 PHP
PHP随机生成唯一HASH值自定义函数
2015/04/20 PHP
laravel框架中路由设置，路由参数和路由命名实例分析
2019/11/23 PHP
JS 创建对象(常见的几种方法)
2008/11/03 Javascript
JavaScript二维数组实现的省市联动菜单
2014/05/08 Javascript
使用javascript实现监控视频播放并打印日志
2015/01/05 Javascript
jquery 插件实现多行文本框[textarea]自动高度
2015/03/04 Javascript
javascript的变量、传值、传址、参数之间关系
2015/07/26 Javascript
Bootstarp风格的toggle效果分享
2016/02/23 Javascript
在Node.js中使用Javascript Generators详解
2016/05/05 Javascript
BootStrap实现手机端轮播图左右滑动事件
2016/10/13 Javascript
JavaScript登录记住密码操作(超简单代码)
2017/03/22 Javascript
JavaScript截屏功能的实现代码
2017/07/28 Javascript
swiper在angularjs中使用循环轮播失效的解决方法
2018/09/27 Javascript
layui 对table中的数据进行转义的实例
2019/09/12 Javascript
基于JavaScript 实现拖放功能
2019/09/12 Javascript
解决echarts中横坐标值显示不全(自动隐藏)问题
2020/07/20 Javascript
[36:33]完美世界DOTA2联赛PWL S2 LBZS vs Forest 第二场 11.29
2020/12/02 DOTA
python基础教程之获取本机ip数据包示例
2014/02/10 Python
Python操作MySQL数据库9个实用实例
2015/12/11 Python
python字符串连接方法分析
2016/04/12 Python
Python PyAutoGUI模块控制鼠标和键盘实现自动化任务详解
2018/09/04 Python
python 绘制拟合曲线并加指定点标识的实现
2019/07/10 Python
为什么说Python可以实现所有的算法
2019/10/04 Python
三星英国官网：Samsung英国
2018/09/25 全球购物
描述JSP和Servlet的区别、共同点、各自应用的范围
2012/10/02 面试题
开办大学饮食联盟创业计划书
2014/01/29 职场文书
法制宣传口号
2014/06/16 职场文书
我们的节日春节活动方案
2014/08/22 职场文书
司机岗位职责
2015/02/04 职场文书
销售合作意向书范本
2015/05/08 职场文书
法人代表证明书范本
2015/06/18 职场文书
表扬稿表扬信的格式及范文
2019/06/24 职场文书
Golang 并发下的问题定位及解决方案
2022/03/16 Golang