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+CSS模拟可以无刷新显示内容的留言板实例
Mar 03 Javascript
AngularJS身份验证的方法
Feb 17 Javascript
Vue.js每天必学之过滤器与自定义过滤器
Sep 07 Javascript
JS访问DOM节点方法详解
Nov 29 Javascript
Angularjs 事件指令详细整理
Jul 27 Javascript
对Vue.js之事件的绑定(v-on: 或者 @ )详解
Sep 15 Javascript
记React connect的几种写法(小结)
Sep 18 Javascript
Vue 实现手动刷新组件的方法
Feb 19 Javascript
深入了解query和params的使用区别
Jun 24 Javascript
vue iview多张图片大图预览、缩放翻转
Jul 13 Javascript
Vue使用Three.js加载glTF模型的方法详解
Jun 14 Javascript
微信小程序实现首页弹出广告
Dec 03 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
论坛头像随机变换代码
2006/10/09 PHP
php中session_id()函数详细介绍,会话id生成过程及session id长度
2015/09/23 PHP
PHP上传文件及图片到七牛的方法
2018/07/25 PHP
PHP使用gearman进行异步的邮件或短信发送操作详解
2020/02/27 PHP
jquery 简单的进度条实现代码
2010/03/11 Javascript
JavaScript instanceof 的使用方法示例介绍
2013/10/23 Javascript
Bootstrap基础学习
2015/06/16 Javascript
用jQuery获取table中行id和td值的实现代码
2016/05/19 Javascript
对jQuary选择器的全面总结
2016/06/20 Javascript
BootStrap tab选项卡使用小结
2020/08/09 Javascript
JS实现的文字间歇循环滚动效果完整示例
2018/02/13 Javascript
JavaScript图片处理与合成总结
2018/03/04 Javascript
详解从买域名到使用pm2部署node.js项目全过程
2018/03/07 Javascript
nodejs前端模板引擎swig入门详解
2018/05/15 NodeJs
Vue+element-ui 实现表格的分页功能示例
2018/08/18 Javascript
详解create-react-app 2.0版本如何启用装饰器语法
2018/10/23 Javascript
webpack4+express+mongodb+vue实现增删改查的示例
2018/11/08 Javascript
Vue动态生成el-checkbox点击无法赋值的解决方法
2019/02/21 Javascript
JS正则表达式封装与使用操作示例
2019/05/15 Javascript
微信小程序实现点击空白隐藏的方法示例
2019/08/13 Javascript
Vue的全局过滤器和私有过滤器的实现
2020/04/20 Javascript
快速解决vue2+vue-cli3项目ie兼容的问题
2020/11/17 Vue.js
Python实现读取SQLServer数据并插入到MongoDB数据库的方法示例
2018/06/09 Python
Python中@property的理解和使用示例
2019/06/11 Python
Python实现投影法分割图像示例(二)
2020/01/17 Python
Python Django2 model 查询介绍(条件、范围、模糊查询)
2020/03/16 Python
浅析Python面向对象编程
2020/07/10 Python
利用python3筛选excel中特定的行(行值满足某个条件/行值属于某个集合)
2020/09/04 Python
python的链表基础知识点
2020/09/13 Python
美国维生素、补充剂、保健食品购物网站:Vitacost
2016/08/05 全球购物
美国宠物美容和宠物用品购物网站:Cherrybrook
2018/12/07 全球购物
村干部承诺书
2014/03/28 职场文书
建筑专业毕业生自荐信
2014/05/25 职场文书
通知书大全
2015/04/27 职场文书
写自招自荐信的绝招!
2019/04/19 职场文书
疑《守望先锋2》A测截图泄露 或将推出新模式、新界面
2022/04/03 其他游戏