如果放入的資料想要先經過排序，我想先把資料放入ＷＯＲＤ或是ＥＸＣＥＬ裡都是很好的選擇，經過排序後想要放回ＤＲＥＡＭＷＥＡＶＥＲ也很簡單，只需要使用＂複製＂和＂貼上＂，表格就做好囉！
但是如果你想讓使用者自己可以做排序，是任何一個欄位都能排序，而且是使用者想排就排，哇～不用說，寫程式就對了，要怎麼寫我想頭就大了吧！
今天要介簡的這個好用的 JavaScript 套件，就是針對上述的使用情況來地，下圖是還沒使用時的表格長像。
這張圖就是使用後的長像，它在表格的標題列會上底色，使用者只要在想排序的欄位上按一下，就會出現像第一欄的 Name 一欄的＂三角形＂，三角形向上就是遞減（由大到小）排序，三角形向下就是遞增（由小到大）排序，很方便吧！
這個方式最重要的是，不用寫程式，而且使用很方便哦～
底下就是使用方法，請照著做即可。
先將 sorttable.js 檔案下載到網站資料夾下，再把以下的 JavaScript 貼入到 <head> </head> 中即可~
<script src="sorttable.js"></script>
<style type="text/css">
/* Sortable tables */
table.sortable thead
{
background-color:#eee;
color:#666666;
font-weight: bold;
cursor: default;
}
</style>
最後再將你的表格加上一個 Class 的屬性即可，就是把 <table> 標籤，後面加上class="sortable" ，改成 <table class="sortable"> 就可以使用囉～
官方網站：http://www.kryogenix.org/code/browser/sorttable/
直接下載：http://www.kryogenix.org/code/browser/sorttable/sorttable.js
1 Comments:
老師您好：
請問這個js檔是免費使用的嗎？會有功能上的限制嗎？
因為我之前曾下載過國外的導覽列js檔，但發現是有版權的，沒付費的話會有限制。
張貼留言