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

javascript闭包的理解和实例

Aug 12 Javascript

Javascript表格翻页效果的具体实现

Oct 05 Javascript

Node.js操作mysql数据库增删改查

Mar 30 Javascript

jQuery中的ready函数与window.onload谁先执行

Jun 21 Javascript

Vue.js一个文件对应一个组件实践

Oct 27 Javascript

js 颜色选择插件

Jan 23 Javascript

JavaScript中闭包的详解

Apr 01 Javascript

React利用插件和不用插件实现双向绑定的方法详解

Jul 03 Javascript

JQuery 又谈ajax局部刷新

Nov 27 jQuery

深入理解JS异步编程-Promise

Jun 03 Javascript

js实现简单的无缝轮播效果

Sep 05 Javascript

原生JavaScript实现留言板

Jan 10 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 Document 代码注释规范

2009/04/13 PHP

让你成为更出色的PHP开发者的10个技巧

2011/02/25 PHP

PHP关联数组实现根据元素值删除元素的方法

2015/06/26 PHP

Netbeans 8.2将支持PHP7 更精彩

2016/06/13 PHP

解决php写入数据库乱码的问题

2019/09/17 PHP

js动态改变select选择变更option的index值示例

2014/07/10 Javascript

关于编写性能高效的javascript事件的技术

2014/11/28 Javascript

js判断手机和pc端选择不同执行事件的方法

2015/01/30 Javascript

微信js-sdk预览图片接口及从拍照或手机相册中选图接口用法示例

2016/10/13 Javascript

JavaScript登录验证码的实现

2016/10/27 Javascript

原生js代码实现图片放大境效果

2016/10/30 Javascript

常用的javascript设计模式

2017/01/11 Javascript

vue组件之Alert的实现代码

2017/10/17 Javascript

Vue 过滤器filters及基本用法

2017/12/26 Javascript

JavaScript设计模式之原型模式分析【ES5与ES6】

2018/07/26 Javascript

微信小程序自定义组件封装及父子间组件传值的方法

2018/08/28 Javascript

Vue中Axios从远程/后台读取数据

2019/01/21 Javascript

layer.prompt输入层的例子

2019/09/24 Javascript

小程序瀑布流组件实现翻页与图片懒加载

2020/05/19 Javascript

Vue和React有哪些区别

2020/09/12 Javascript

Python脚本实时处理log文件的方法

2016/11/21 Python

为什么str(float)在Python 3中比Python 2返回更多的数字

2018/10/16 Python

对python_discover方法遍历所有执行的用例详解

2019/02/13 Python

Django Rest framework权限的详细用法

2019/07/25 Python

通过celery异步处理一个查询任务的完整代码

2019/11/19 Python

Pytorch 保存模型生成图片方式

2020/01/10 Python

python实现自动清理重复文件

2020/08/24 Python

Python模块常用四种安装方式

2020/10/20 Python

英国家喻户晓的折扣商场：TK Maxx

2017/05/26 全球购物

护士试用期自我鉴定

2014/02/08 职场文书

2014年关于两会精神的心得体会

2014/03/17 职场文书

群众路线教育实践活动思想汇报（2014特荐篇）

2014/09/16 职场文书

作文评语怎么写

2014/12/25 职场文书

保险公司岗前培训工作总结

2015/10/24 职场文书

Spring实现内置监听器

2021/07/09 Java/Android

JavaScript中MutationObServer监听DOM元素详情

2021/11/27 Javascript