编程 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 相关文章推荐

列表内容的选择

Jun 30 Javascript

extJs 常用到的增，删，改，查操作代码

Dec 28 Javascript

Javascript中Array.prototype.map()详解

Oct 22 Javascript

JavaScript中Null与Undefined的区别解析

Jun 30 Javascript

jquery自定义右键菜单、全选、不连续选择

Mar 01 Javascript

JS正则表达式修饰符中multiline(/m)用法分析

Dec 27 Javascript

node.js中使用Export和Import的方法

Sep 18 Javascript

EasyUI实现下拉框多选功能

Nov 07 Javascript

VUE Error: getaddrinfo ENOTFOUND localhost

May 03 Javascript

Vue.js 父子组件通信的十种方式

Oct 30 Javascript

Vue触发式全局组件构建的方法

Nov 28 Javascript

vue界面发送表情的实现代码

Sep 11 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

实例(Smarty+FCKeditor新闻系统)

2007/01/02 PHP

PHP的autoload机制的实现解析

2012/09/15 PHP

php读取文件内容的方法汇总

2015/01/24 PHP

PHP接入微信H5支付的方法示例

2019/10/28 PHP

javascript下操作css的float属性的特殊写法

2007/08/22 Javascript

javascript学习基础笔记之DOM对象操作

2011/11/03 Javascript

用js模拟struts2的多action调用示例

2014/05/19 Javascript

jquery中的常用事件bind、hover、toggle等示例介绍

2014/07/21 Javascript

JQuery设置获取下拉菜单某个选项的值(比较全)

2014/08/05 Javascript

浅谈JavaScript中Date(日期对象),Math对象

2015/02/05 Javascript

jQuery实现仿淘宝带有指示条的图片转动切换效果完整实例

2015/03/04 Javascript

js实现超简单的展开、折叠目录代码

2015/08/28 Javascript

Vue模拟数据,实现路由进入商品详情页面的示例

2018/08/31 Javascript

理顺8个版本vue的区别(小结)

2018/09/17 Javascript

NodeJS 将文件夹按照存放路径变成一个对应的JSON的方法

2018/10/17 NodeJs

JavaScript中的相等操作符使用详解

2019/12/21 Javascript

Javascript如何实现扩充基本类型

2020/08/26 Javascript

[04:28]DOTA2亚洲邀请赛小组赛第五日 TOP10精彩集锦

2015/02/03 DOTA

Python 2与Python 3版本和编码的对比

2017/02/14 Python

Python实现多并发访问网站功能示例

2017/06/19 Python

Python实现批量压缩图片

2018/01/25 Python

python如何制作英文字典

2019/06/25 Python

Apache,wsgi,django 程序部署配置方法详解

2019/07/01 Python

python datetime中strptime用法详解

2019/08/29 Python

Python数据存储之 h5py详解

2019/12/26 Python

Python通过递归函数输出嵌套列表元素

2020/10/15 Python

CSS3 函数技巧用css 实现js实现的事情(clac Counters Tooltip)

2017/08/15 HTML / CSS

吉力贝官方网站：Jelly Belly

2019/03/11 全球购物

一些高难度的SQL面试题

2016/11/29 面试题

丑小鸭教学反思

2014/02/03 职场文书

简历中的自我评价范文

2014/02/05 职场文书

优秀工会工作者事迹材料

2014/06/02 职场文书

观后感开头

2015/06/19 职场文书

门面租赁合同范文

2019/08/06 职场文书

创业计划书之书店

2019/09/10 职场文书

Pandas 稀疏数据结构的实现

2021/07/25 Python