编程 Javascript

jqeury-easyui-layout问题解决方法

Posted in Javascript onMarch 24, 2014

今天在用easyui做布局时，碰到了一个疑惑的问题。

问题：当把class=“easyui-layout”写在一个独立的div中时，layout的样式无法显示，也不报错。

例如：

<span style="font-size:14px;"><body > 
<div class="easyui-layout"> 
<div data-options="region:'north',title:'North Title',split:true" style="height: 100px;"> 
</div> 
<div data-options="region:'south',title:'South Title',split:true" style="height: 100px;"> 
</div> 
<div data-options="region:'east',iconCls:'icon-reload',title:'East',split:true" style="width: 100px;"> 
</div> 
<div data-options="region:'west',title:'West',split:true" style="width: 100px;"> 
</div> 
<div data-options="region:'center',title:'center title'" href="CenterPage.html" style="background: #eee; overflow: hidden;"> 
</div> 
</div> 
</body></span>

显示：

解决：把class=“easyui-layout”写在body中时，问题就迎刃而解了。且region属性不能被其他无关的div所包含。

代码：

<span style="font-size:14px;"><body class="easyui-layout"> <div data-options="region:'north',title:'North Title',split:true" style="height: 100px;"> 
</div> 
<div data-options="region:'south',title:'South Title',split:true" style="height: 100px;"> 
</div> 
<div data-options="region:'east',iconCls:'icon-reload',title:'East',split:true" style="width: 100px;"> 
</div> 
<div data-options="region:'west',title:'West',split:true" style="width: 100px;"> 
</div> 
<div data-options="region:'center',title:'center title'" href="CenterPage.html" style="background: #eee; overflow: hidden;"> 
</div> 
</body></span>

一直在想这是为什么？

jqeury-easyui-layout问题解决方法

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

Javascript 相关文章推荐

用window.location.href实现刷新另个框架页面

Mar 07 Javascript

JavaScript 浮点数运算精度问题

Oct 06 Javascript

javascript最常用与实用的创建类的代码

Aug 12 Javascript

仅IE6/7/8中innerHTML返回值忽略英文空格的问题

Apr 07 Javascript

jquery拖动插件(jquery.drag)使用介绍

Jun 18 Javascript

jquery禁止输入数字以外的字符的示例(纯数字验证码)

Apr 10 Javascript

JsRender for index循环索引用法详解

Oct 31 Javascript

Three.js学习之正交投影照相机

Aug 01 Javascript

JS实现搜索框文字可删除功能

Dec 28 Javascript

基于vue实现一个神奇的动态按钮效果

May 15 Javascript

Vue watch响应数据实现方法解析

Jul 10 Javascript

微信小程序实现点击页面出现文字

Sep 21 Javascript

让table变成exls的示例代码

Mar 24 #Javascript

JQuery 图片滚动轮播示例代码

Mar 24 #Javascript

JS中判断null、undefined与NaN的方法

Mar 24 #Javascript

jquery高级编程的最佳实践详解

Mar 23 #Javascript

js 判断浏览器使用的语言示例代码

Mar 22 #Javascript

jquery easyui 对于开始时间小于结束时间的判断示例

Mar 22 #Javascript

js过滤特殊字符输入适合输入、粘贴、拖拽多种情况

Mar 22 #Javascript

You might like

PHP 利用AJAX获取网页并输出的实现代码(Zjmainstay)

2012/08/31 PHP

php读取图片内容并输出到浏览器的实现代码

2013/08/08 PHP

php的GD库imagettftext函数解决中文乱码问题

2015/01/24 PHP

PHP基于单例模式编写PDO类的方法

2016/09/13 PHP

超强多功能php绿色集成环境详解

2017/01/25 PHP

Javascript 错误处理的几种方法

2009/06/13 Javascript

Javascript中的变量使用说明

2010/05/18 Javascript

基于jquery的表格排序

2010/09/11 Javascript

多种方式实现JS调用后台方法进行数据交互

2013/08/20 Javascript

Javascript基础教程之JavaScript语法

2015/01/18 Javascript

一篇文章掌握RequireJS常用知识

2016/01/26 Javascript

jquery对Json的各种遍历方法总结(必看篇)

2016/09/29 Javascript

JSON对象详解及实例代码

2016/10/18 Javascript

jquery实现输入框实时输入触发事件代码

2016/12/21 Javascript

JS实现超简单的汉字转拼音功能示例

2016/12/22 Javascript

js实现从左向右滑动式轮播图效果

2017/07/07 Javascript

node.js实现简单的压缩/解压缩功能示例

2019/11/05 Javascript

jQuery轮播图功能制作方法详解

2019/12/03 jQuery

JavaScript数组类型Array相关的属性与方法详解

2020/09/08 Javascript

Python2.x版本中cmp()方法的使用教程

2015/05/14 Python

如何使用七牛Python SDK写一个同步脚本及使用教程

2015/08/23 Python

python使用PIL给图片添加文字生成海报示例

2018/08/17 Python

Python 使用元类type创建类对象常见应用详解

2019/10/17 Python

一级方程式赛车官方网上商店：F1 Store（支持中文）

2018/01/12 全球购物

iKRIX意大利网上商店：男女豪华服装和配件

2019/10/09 全球购物

韩国商务邀请函

2014/01/14 职场文书

财务会计大学生自我评价

2014/04/09 职场文书

宿舍标语大全

2014/06/19 职场文书

电教室标语

2014/06/20 职场文书

个人收入证明范本

2014/09/18 职场文书

三峡大坝导游词

2015/01/31 职场文书

现场施工员岗位职责

2015/04/11 职场文书

商场营业员岗位职责

2015/04/14 职场文书

无工作证明怎么写

2015/06/15 职场文书

2015年社区重阳节活动总结

2015/07/30 职场文书

mysql通过group by分组取最大时间对应数据的两种有效方法

2022/09/23 MySQL