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

jquery 输入框数字限制插件

Nov 10 Javascript

Json2Template.js 基于jquery的插件绑定JavaScript对象到Html模板中

Oct 29 Javascript

js实现的点击div区域外隐藏div区域

Jun 30 Javascript

javascript和jquery实现设置和移除文本框默认值效果代码

Jan 13 Javascript

利用原生JS自动生成文章标题树的实例

Aug 22 Javascript

Angular的$http与$location

Dec 26 Javascript

JavaScript mixin实现多继承的方法详解

Mar 30 Javascript

详解Immutable及 React 中实践

Mar 01 Javascript

js实现带积分弹球小游戏

Jul 21 Javascript

Vue实现移动端拖拽交换位置

Jul 29 Javascript

如何使用原生Js实现随机点名详解

Jan 06 Javascript

JavaScript分页组件使用方法详解

Jul 26 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写的MySQL数据库用户认证系统代码

2007/03/22 PHP

PHP读取文件内容后清空文件示例代码

2014/03/18 PHP

使用XHGui来测试PHP性能的教程

2015/07/03 PHP

常见PHP数据库解决方案分析介绍

2015/09/24 PHP

php实现smarty模板无限极分类的方法

2015/12/07 PHP

thinkPHP交易详情查询功能详解

2016/12/02 PHP

laravel框架与其他框架的详细对比

2019/10/23 PHP

location对象的属性和方法应用(解析URL)

2013/04/12 Javascript

bootstrap-treeview自定义双击事件实现方法

2016/01/09 Javascript

Linux下为Node.js程序配置MySQL或Oracle数据库的方法

2016/03/19 Javascript

微信小程序（应用号）开发新闻客户端实例

2016/10/24 Javascript

详解node-ccap模块生成captcha验证码

2017/07/01 Javascript

JS监控关闭浏览器操作的实例详解

2017/09/12 Javascript

微信小程序使用picker实现时间和日期选择框功能【附源码下载】

2017/12/11 Javascript

vue父子组件通信的高级用法示例

2019/08/29 Javascript

JQuery事件冒泡和默认行为代码实例

2020/05/13 jQuery

解决vue-pdf查看pdf文件及打印乱码的问题

2020/11/04 Javascript

Nodejs 微信小程序消息推送的实现

2021/01/20 NodeJs

教你用Python创建微信聊天机器人

2020/03/31 Python

使用python爬取抖音视频列表信息

2019/07/15 Python

使用pandas读取文件的实现

2019/07/31 Python

Django多进程滚动日志问题解决方案

2019/12/17 Python

pytorch实现MNIST手写体识别

2020/02/14 Python

python输入一个水仙花数(三位数) 输出百位十位个位实例

2020/05/03 Python

使用AJAX和Django获取数据的方法实例

2020/10/25 Python

如何用canvas实现在线签名的示例代码

2018/07/10 HTML / CSS

澳大利亚最大的女装零售商：Millers

2017/09/10 全球购物

联想印度官方网上商店：Lenovo India

2019/08/24 全球购物

Pharmacy Online中文直邮网站：澳洲大型药房

2020/06/27 全球购物

采购内勤岗位职责

2013/12/10 职场文书

银行求职信怎么写

2014/05/26 职场文书

青春飞扬演讲稿

2014/09/11 职场文书

2015年妇女工作总结

2015/05/14 职场文书

Python 处理表格进行成绩排序的操作代码

2021/07/26 Python

Win11安装升级时提示“该电脑必须支持安全启动”

2022/04/19 数码科技

Meta增速拉垮，元宇宙难当重任

2022/04/29 数码科技