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>

显示:
jqeury-easyui-layout问题解决方法 
解决:把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 相关文章推荐
JS分割字符串并放入数组的函数
Jul 04 Javascript
各情景下元素宽高的获取实现代码
Sep 13 Javascript
jquery中dom操作和事件的实例学习-表单验证
Nov 30 Javascript
javascript中call和apply的用法示例分析
Apr 02 Javascript
jquery序列化方法实例分析
Jun 10 Javascript
基于jQuery实现的向下滑动二级菜单效果代码
Aug 31 Javascript
jquery实现图片预加载
Dec 25 Javascript
jQuery隐藏和显示效果实现
Apr 06 Javascript
Vue.js结合bootstrap实现分页控件
Mar 10 Javascript
微信小程序中子页面向父页面传值实例详解
Mar 20 Javascript
Vue的elementUI实现自定义主题方法
Feb 23 Javascript
antd design table更改某行数据的样式操作
Oct 31 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
咖啡知识大全
2021/03/03 新手入门
PHP获取文件的MD5值并判断是否被修改的例子
2014/06/19 PHP
3款值得推荐的微信开发开源框架
2014/10/28 PHP
php redis实现文章发布系统(用户投票系统)
2017/03/04 PHP
PHP封装的完整分页类示例
2018/08/21 PHP
基于jquery的获取mouse坐标插件的实现代码
2010/04/01 Javascript
真正的JQuery.ajax传递中文参数的解决方法
2011/05/28 Javascript
js模拟点击以提交表单为例兼容主流浏览器
2013/11/29 Javascript
jquery退出each循环的写法
2014/02/26 Javascript
jQuery中fadeOut()方法用法实例
2014/12/24 Javascript
jquery点击改变class并toggle的实现代码
2016/05/15 Javascript
javascript Promise简单学习使用方法小结
2016/05/17 Javascript
JavaScript鼠标特效大全
2016/09/13 Javascript
基于jQuery实现简单人工智能聊天室
2017/02/10 Javascript
微信小程序 首页制作简单实例
2017/04/07 Javascript
JavaScript实现的弹出遮罩层特效经典示例【基于jQuery】
2019/07/10 jQuery
js针对图片加载失败的处理方法分析
2019/08/24 Javascript
python实现简单购物商城
2016/05/21 Python
使用Python对Access读写操作
2017/03/30 Python
《Python学习手册》学习总结
2018/01/17 Python
python实现Windows电脑定时关机
2018/06/20 Python
pandas 数据归一化以及行删除例程的方法
2018/11/10 Python
python识别文字(基于tesseract)代码实例
2019/08/24 Python
全球速卖通法国在线交易平台:AliExpress法国
2017/07/07 全球购物
法学专业应届生求职信
2013/10/16 职场文书
自主招生自荐书
2013/11/29 职场文书
讲解员培训方案
2014/05/04 职场文书
团支部推优材料
2014/05/21 职场文书
小学教师师德承诺书
2014/05/23 职场文书
四风剖析查摆对照检查材料思想汇报
2014/09/24 职场文书
2015欢度元旦标语口号
2014/12/09 职场文书
家长会主持词开场白
2015/05/29 职场文书
会议主持词通用版
2019/04/02 职场文书
python如何正确使用yield
2021/05/21 Python
深入浅出的讲解:信号调制到底是如何实现的
2022/02/18 无线电
使用CSS实现音波加载效果
2023/05/07 HTML / CSS