因為工作上的需要,所以會需要表格置頂。 但是用google找到的都不是我要的。想來想去,只好用這一招了。 以下是我處理的方式,首先我是預設第一個tr內容就是標頭了。 所以我先做如下的處理 HTML: $("#myTable tr:first td").each(function(i){ f_div += '<div class="f_div" style="float:left;width:'+$(this).width()+'px;">'+$(this).html()+'</div>'; }); $("#myTable").before($("<div class='tab_head'>"+f_div+"</div>")) 先將其td的寬度取出並建立好一個div出來。你可以先讓他顯示來比對原標頭長度是否正確 然後再做捲軸的判斷處理 HTML: $(window).scroll(function(){ st = $(this).scrollTop() h = $("#myTable").offset(); if(st>h.top){ $(".tab_head").show(); }else{ $(".tab_head").hide(); } }); 然後css對應如下 HTML: .tab_head{ position: fixed; top:0px; z-index: 99; display: none; } .tab_head .f_div{ /* 這邊的內容依照你原來的標頭td的css設定就好,這樣就不會跑掉*/ } /*以下是我配合線條使用的,防止因線條的關係對應不準。可視情況使用。 .tab_head .f_div:first-child{ border-width:0px 0px 1px 1px; } .tab_head .f_div:last-child{ border-width:0px 0px 1px 1px; } 這樣就大功告成了。 適用於任何表格上處理。如果標頭是th的話。也只要將td改成th就行了。 重點在於要取得其寬度好做出一個浮動的div。當表格的標頭消失在頂端就將其出現就行了 原本是想將f_div的css用copy的方式建立。不過後來想想比較麻煩。 所以就交給使用者自行去定義了。畢竟各使用者的table的定義不同。