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