[DHTML] 網頁 DataGrid 製作筆記
一般的HTML頁面不像Flash或是VB等軟體，有DataGrid元件可以使用，所以要在普通Html頁面做到類似效果，需要藉助一些Javascript寫成DHTML的頁面，網路上有一堆範例可以參考，複雜度大小有異，懶懶的自己做了一個超簡單的樣本，有興趣參考看看囉！
»DG樣本
使用重點：
- 製作兩的Table，一個為TabHead一個為TabBody分別是DG的標題欄位及資料欄位。
- 撰寫一個取得DGScroll位置的function adjustScroll(如Code1)
- 使用onscroll事件呼叫adjustScroll函式於TabBody，於托拉Scroll時即時更改DG的TabHead的位置。(如Code2)
- 使用onResize事件呼叫adjustScroll函式於body，解決視窗縮放時即時更改DG的TabHead的位置。(如Code3)
Code1
<SCRIPT>
function adjustScroll(obj){
document.getElementById("tabHead").scrollLeft=document.getElementById(obj.id).scrollLeft;
document.getElementById("tabHead").style.width=document.getElementById(obj.id).clientWidth;
}
</SCRIPT>
Code2
...
<div id="tabBody" onscroll="adjustScroll(this);">
...
Code3
...
<body onResize="adjustScroll(document.getElementById('tabBody'));">
...
網路參考：
![[筆記]101煙火攝影教戰守則](http://blog.tanjun.info/wp-content/themes/hueman/assets/front/img/thumb-medium-empty.png)
