jQuery滾動新聞實現代碼
608
2024-02-26
最近在把以前寫的一個項目改成用easyui做前端。過程中遇到了不少問題。其中一個就是datagrid不能很好的布局。想了好多辦法都有局限。最后想到會不會是布局的問題，經過實踐，最后問題解決。
1：比如在項目中用到了datagrid。如果界面比較簡單－－－只有一個datagrid只需要把它的屬性fit 設置為true就能實現自動適應窗體。如果在datagrid上方還有其他div的話，datagrid就不能很好的自動適應窗體。如查datagrid有分頁控件，分頁控件就看不到了。這個時候就應該用 easyui-layout來分隔窗體來使具體的內容放在easyui-layout不同的部分。這樣就能很好的解決自適應問題。
代碼如下：
<div class="easyui-layout"data-options="fit:true">
<div data-options="region:'north'" style="height:100px">
<table id="part1"></table>
</div>
<div data-options="region:'center'">
<table id="part2"></table>
</div>
</div>
2：基于body標簽的easyui-layout當瀏覽器窗口大小改變時,easyui-layout可以根據窗口的大小來調整自己的大小.基于div標簽的easyui-layout如果想擁有上述功能必須設置easyui-layout的屬性fit等于true.
情形1：
<body class="easyui-layout">
<div data-options="region:'north'" style="height:100px">
<table id="part1"></table>
</div>
<div data-options="region:'center'">
<table id="part2"></table>
</div>
</div>
情形2：
<div class="easyui-layout"data-options="fit:true">
<div data-options="region:'north'" style="height:100px">
<table id="part1"></table>
</div>
<div data-options="region:'center'">
<table id="part2"></table>
</div>
</div>
3：在html中定義easyui時，下面兩種寫法是一樣的。即easyui控件的屬性可以寫在dataoptions屬性里，也可以把這些屬性寫到標簽上。
寫法1：
<div class="easyui-layout"data-options="fit:true">
<div data-options="region:'north'" style="height:100px">
<table id="part1"></table>
</div>
<div data-options="region:'center'">
<table id="part2"></table>
</div>
</div>
寫法2：
<div class="easyui-layout"fit="true">
<div region="north"style="height:100px;">
<table id="part1"></table>
</div>
<div region="center">
<table id="part2"></table>
</div>
</div>
以上就是EasyUI高度自適應的全部內容，希望能給大家一個參考，也希望大家多多支持綠夏網。
