jqeury-easyui-layout問題解決方法

更新時(shí)間：2014年03月24日 15:43:12 作者：

jqeury-easyui-layout問題：當(dāng)把class=“easyui-layout”寫在一個(gè)獨(dú)立的div中時(shí)，layout的樣式無法顯示，具體示例如下

今天在用easyui做布局時(shí)，碰到了一個(gè)疑惑的問題。

問題：當(dāng)把class=“easyui-layout”寫在一個(gè)獨(dú)立的div中時(shí)，layout的樣式無法顯示，也不報(bào)錯(cuò)。

例如：

復(fù)制代碼代碼如下:

 
<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中時(shí)，問題就迎刃而解了。且region屬性不能被其他無關(guān)的div所包含。

代碼：

復(fù)制代碼代碼如下:

 
<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> 

一直在想這是為什么？

您可能感興趣的文章:

相關(guān)文章

jqPlot 基于jquery的畫圖插件
jqPlot是一款基于jquery類庫的圖標(biāo)繪制插件。通過jqPlot可以再網(wǎng)頁中繪制線狀、柱狀、餅狀等多種樣式圖表。而且，jqPlot具有插件可擴(kuò)展性(Pluggability)，你可以編寫自己的圖表樣式。
2011-04-04
jQuery實(shí)現(xiàn)的進(jìn)度條效果
本文主要給大家介紹的是jQuery實(shí)現(xiàn)的進(jìn)度效果的實(shí)例代碼，其實(shí)現(xiàn)原理就是使用 Javascript 控制 SPAN CSS 的寬度（以及其他的樣式）有需要的小伙伴可以參考下。
2015-07-07
jQuery利用cookie 實(shí)現(xiàn)本地收藏功能(不重復(fù)無需多次命名)
cookie 是存儲(chǔ)于訪問者計(jì)算機(jī)中的變量。這篇文章主要介紹了jQuery利用cookie 實(shí)現(xiàn)本地收藏功能不重復(fù)無需多次命名,需要的朋友可以參考下
2019-11-11
基于jquery的圖片輪播 tab切換組件
最近在做手機(jī)上的web app，很多場景需要使用到類似tab切換和圖片輪播的東西，需要支持手勢和鼠標(biāo)點(diǎn)擊的，于是就基于jquery弄了一個(gè)，每一個(gè)參數(shù)有詳細(xì)的說明
2012-07-07
Jquery動(dòng)態(tài)添加輸入框的方法
這篇文章主要介紹了Jquery動(dòng)態(tài)添加輸入框的方法,實(shí)例分析了jQuery中append方法添加頁面元素的使用技巧,需要的朋友可以參考下
2015-05-05
jQuery自定義動(dòng)畫函數(shù)實(shí)例詳解(附demo源碼)
這篇文章主要介紹了jQuery自定義動(dòng)畫函數(shù)實(shí)現(xiàn)方法,形式實(shí)例分析了jQuery通過插件結(jié)合數(shù)學(xué)運(yùn)算實(shí)現(xiàn)滑塊動(dòng)畫運(yùn)動(dòng)的效果,并附完整demo源碼供讀者下載,需要的朋友可以參考下
2015-12-12
jackson解析json字符串,首字母大寫會(huì)自動(dòng)轉(zhuǎn)為小寫的方法
下面小編就為大家分享一篇jackson解析json字符串,首字母大寫會(huì)自動(dòng)轉(zhuǎn)為小寫的方法，具有很好的參考價(jià)值，希望對大家有所幫助。一起跟隨小編過來看看吧
2017-12-12
jQuery中$.ajax()和$.getJson()同步處理詳解
這篇文章主要介紹了jQuery中$.ajax()和$.getJson()同步處理詳解的相關(guān)資料，非常的細(xì)致全面，有需要的小伙伴可以參考下。
2015-08-08
jquery JSON的解析方式
第一次用JSON作為jquery異步請求的傳輸對象，結(jié)果在jquery請求后返回的結(jié)果是字符串還是json對象上折騰了半天。等到問題解決了，也大致明白怎么個(gè)意思了，歸根結(jié)底還是對jquery對相關(guān)json對象獲取的理解有所偏差。
2009-07-07
jQuery實(shí)現(xiàn)圖片上傳預(yù)覽效果功能完整實(shí)例【測試可用】
這篇文章主要介紹了jQuery實(shí)現(xiàn)圖片上傳預(yù)覽效果功能,結(jié)合完整實(shí)例形式分析了jQuery處理圖片上傳預(yù)覽相關(guān)事件響應(yīng)、瀏覽器判斷、圖片及頁面元素動(dòng)態(tài)操作相關(guān)實(shí)現(xiàn)技巧,需要的朋友可以參考下
2018-05-05