弄了半天都不出資料，看了2個多小時終于加載出資料了，這裡總結一下步驟。暫時是最簡單的，隻顯示資料，不進行資料操作。
先上代碼：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<link rel="stylesheet" type="text/css" href="https://www.jeasyui.com/easyui/themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="https://www.jeasyui.com/easyui/themes/icon.css">
<link rel="stylesheet" type="text/css" href="https://www.jeasyui.com/easyui/themes/color.css">
<link rel="stylesheet" type="text/css" href="https://www.jeasyui.com/easyui/demo/demo.css">
<script type="text/javascript" src="/mine/easyui/jquery.min.js"></script>
<script type="text/javascript" src="/mine/easyui/jquery.easyui.min.js"></script>
</head>
<body>
<table id="dg" title="My Users" style="width:550px;height:250px"
toolbar="#toolbar" idField="id"
rownumbers="true" fitColumns="true" singleSelect="true">
<thead>
<tr>
<th field="id" width="50" editor="{type:'validatebox',options:{required:true}}">ID</th>
<th field="user_id" width="50" editor="{type:'validatebox',options:{required:true}}">UID</th>
<th field="time" width="50" editor="text">TIME</th>
<th field="type" width="50" editor="{type:'validatebox',options:{required:'true'}}">TYPE</th>
</tr>
</thead>
</table>
<div id="toolbar">
<a href="#" class="easyui-linkbutton" iconCls="icon-add" plain="true" onclick="javascript:$('#dg').edatagrid('addRow')">New</a>
<a href="#" class="easyui-linkbutton" iconCls="icon-remove" plain="true" onclick="javascript:$('#dg').edatagrid('destroyRow')">Destroy</a>
<a href="#" class="easyui-linkbutton" iconCls="icon-save" plain="true" onclick="javascript:$('#dg').edatagrid('saveRow')">Save</a>
<a href="#" class="easyui-linkbutton" iconCls="icon-undo" plain="true" onclick="javascript:$('#dg').edatagrid('cancelRow')">Cancel</a>
</div>
<script>'#dg').datagrid({
url: '/index/index/test2',
});
</script>
</body>
</html> test2請求内容：
$result = Db::table('o_attend')
->select();
$arr['total']=sizeof($result);
$arr['rows']=$result;
echo json_encode($arr); test2傳回格式：
{
"total": 2,
"rows": [{
"id": 1,
"user_id": "1",
"time": "1",
"type": 1}, {
"id": 2,
"user_id": "1",
"time": "1",
"type": 2}]
} 參考：http://www.jeasyui.net/tutorial/147.html
關鍵點描述：
1. 導入庫
<link rel="stylesheet" type="text/css" href="https://www.jeasyui.com/easyui/themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="https://www.jeasyui.com/easyui/themes/icon.css">
<link rel="stylesheet" type="text/css" href="https://www.jeasyui.com/easyui/themes/color.css">
<link rel="stylesheet" type="text/css" href="https://www.jeasyui.com/easyui/demo/demo.css">
<script type="text/javascript" src="/mine/easyui/jquery.min.js"></script>
<script type="text/javascript" src="/mine/easyui/jquery.easyui.min.js"></script> 下載下傳位址：http://www.jeasyui.com/download/index.php
選擇左邊的EasyUI for jqurey，然後導入jquery.min.js和jquery.easyui.min.js，當然，需要檢查一下能不能用。可以拷貝上面的代碼，如果看到上方的：
這個部分，則導入成功。
2.table的頭部
這裡的table的id是要使用的，需要取一個不會重複的id。另一個關鍵點是标簽，此處需要寫一個屬性field，此處field要和擷取的資料的列名名字相同，th個數需要和列數相同。
<table id="dg" title="My Users" style="width:550px;height:250px"
toolbar="#toolbar" idField="id"
rownumbers="true" fitColumns="true" singleSelect="true">
<thead>
<tr>
<th field="id" width="50" editor="{type:'validatebox',options:{required:true}}">ID</th>
<th field="user_id" width="50" editor="{type:'validatebox',options:{required:true}}">UID</th>
<th field="time" width="50" editor="text">TIME</th>
<th field="type" width="50" editor="{type:'validatebox',options:{required:'true'}}">TYPE</th>
</tr>
</thead>
</table> 3.js導入資料
<script>'#dg').datagrid({
url: '/index/index/aaa',
});
</script> 4.php處理
$result = Db::table('o_attend')
->select();
$arr['total']=sizeof($result);
$arr['rows']=$result;
echo json_encode($arr); ![DOM下元素 offset client scroll 相關屬性簡介[圖]](data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACwAAAAAAQABAAACAkQBADs=)