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

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 其他游戏