15款提高表格操作的jQuery插件
當前位置:點晴教程→知識管理交流
→『 技術文檔交流 』
[p][img]http://blog.bingo929.com/wp-content/uploads/2009/12/jquery-table-plugins-title.jpg[/img][/p] [p] table表格由于它的瀏覽器兼容性和復雜的標簽嵌套方式,可以算是添加樣式最困難的對象之一了。大多數前端er都把網頁中的table標簽替換為div,主要就是因為div要比table更容易添加css樣式。但是我們在日常應用中仍然要用到table表格,其中最好的例子就是對照表。今天彬go將向大家推薦[b]15個jquery表格插件[/b]讓你對數據表格進行顯示、排序、篩選和操控。如jquery表格排序插件、jquery表格拖拽插件、jquery樹形表格插件、設置顏色、點擊、替換等效果。[br][br][b][color=#ff6600]您還可以參考以下javascript相關資源:[/color][/b][br]《[url=http://blog.bingo929.com/useful-%20-plot-charts-web.html][color=#00a0e3]推薦9款很棒的網頁繪制圖表javascript框架腳本[/color][/url]》[br]《[url=http://blog.bingo929.com/jquery-%20-tips-to-improve-code.html][color=#00a0e3]了解jquery技巧來提高你的代碼[/color][/url]》[br]《[url=http://blog.bingo929.com/10-ajax-effects-website-fanciness.html][color=#00a0e3]10種javascript特效實例讓你的網站更吸引人[/color][/url]》[br]《[url=http://blog.bingo929.com/300-jquery-css-mootools-js-navigation-menus.html][color=#00a0e3]300+jquery, css, mootools 和 js的導航菜單資源[/color][/url]》[br]《[url=http://javaeye.com/news/6985-24-beautiful-personalized-html-forms-technology][color=#006699]24 個漂亮的個性化 html 表單技術[/color][/url]》[/p] 1.[url=http://datatables.net/][color=#00a0e3]datatables[/color][/url]-強大的jquery表格插件 [p][img]http://blog.bingo929.com/wp-content/uploads/2009/12/datatables.jpg[/img][br] datatables是提供了大量特性的強大jquery表格插件。例如:你可以自動輕松篩選、ajax預讀取數據、分頁、列排序、高亮排序列、擴展插件支持、使用css或jquery ui themeroller 定制主題和完整文檔。[/p] 2.[url=http://gregweber.info/projects/uitablefilter][color=#00a0e3]uitablefilter[/color][/url]-jquery表格過濾插件 [p][img]http://blog.bingo929.com/wp-content/uploads/2009/12/ui-table-filter.jpg[/img][br] uitablefilter是一個用于表格行篩選的jquery插件。插件作者提供了詳細的例子來告訴大家如何將自己的表格和插件整合在一起并完成表格篩選。[/p] 3.[url=http://webtoolkit.info/scrollable-html-table-plugin-for-jquery.html][color=#00a0e3]scrollable html table[/color][/url]-jquery表格滾動插件 [p][img]http://blog.bingo929.com/wp-content/uploads/2009/12/scrollable-html-table.jpg[/img][br] scrollable html table [url=http://blog.bingo929.com/category/technology/jquery-technology][color=#00a0e3]jquery[/color][/url]插件可以讓你的表格變得可以滾動控制。[/p] 4.[url=http://tablesorter.com/docs/][color=#00a0e3]tablesorter[/color][/url]-jquery表格排序插件 [p][img]http://blog.bingo929.com/wp-content/uploads/2009/12/tablesorter.jpg[/img][br] tablesorter這個jquery插件是用來將一個包含thead和tbody標簽的標準html表格轉變為無頁面刷新的可排序表格。它不但支持多列排序,而且跨瀏覽器兼容并且能通過widget系統進行擴展。[/p] 5.[url=http://flexigrid.info/][color=#00a0e3]flexigrid[/color][/url]-web2.0 jquery表格插件 [p][img]http://blog.bingo929.com/wp-content/uploads/2009/12/flexigrid.jpg[/img][br] flexigrid 是一個輕量級的web2.0 jquery插件。它包含很多非常cool的特性,如主題定制、分頁、工具欄、搜索、排序、ajax讀取數據源、調整列寬高尺寸等。[/p] 6.[url=http://jnathanson.com/blog/client/jquery/heatcolor/index.cfm][color=#00a0e3]heatcolor[/color][/url]-jquery表格顏色插件 [p][img]http://blog.bingo929.com/wp-content/uploads/2009/12/heatcolor.jpg[/img][br] heatcolor可以讓你根據元素的值來為元素設置顏色。 它的值的比對時根據預設的一個范圍來進行比較,最后對他們自動進行顏色值的設置。[/p] 7.[url=http://hanpau.com/index.php?page=jqtreetable][color=#00a0e3]jqtreetable[/color][/url]-jquery樹形表格插件 [p][img]http://blog.bingo929.com/wp-content/uploads/2009/12/jqtreetable.jpg[/img][br] 使用jqtreetable插件你可以得到一個樹形表格,如果用戶的瀏覽器禁用了javascript,那么他們也能看到普通形式的表格,并不影響可訪問性。[/p] 8.[url=http://reconstrukt.com/ingrid/][color=#00a0e3]ingrid[/color][/url]-jquery表格插件 [p][img]http://blog.bingo929.com/wp-content/uploads/2009/12/ingrid.jpg[/img][br] ingrid是另一個數據表jquery插件。它也有很多特性,比如列調整尺寸、排序、行列添加樣式等。在作者網站提供了很棒的文檔來告訴大家如何從頭使用這個jquery表格插件。[/p] 9.[url=http://p.sohei.org/jquery-plugins/columnmanager/][color=#00a0e3]jquery columnmanager plugin[/color][/url] [p][color=#00a0e3][img]http://blog.bingo929.com/wp-content/uploads/2009/12/jquery-column-manager.jpg[/img][br][/color] columnmanager是可以控制任意表格列顯示或隱藏的jquery插件,而且它可以保存當前表格的狀態至你下次訪問。這個jquery插件非常小巧輕量,僅3.6kb。[/p] 10.[url=http://blog.cubicphuse.nl/2008/11/12/jquery-treetable-2-0][color=#00a0e3]jquery treetable[/color][/url]-jquery樹形表格插件 [p][img]http://blog.bingo929.com/wp-content/uploads/2009/12/jquery-treetable.jpg[/img][br] jquery treetable是小型的jqtreetable, 它也能讓你的table顯示成樹形結構. 這個插件也可以在瀏覽器禁用javascript時保持文檔整潔并讓原始table可以使用.[/p] 11.[url=http://plugins.jquery.com/project/csv2table][color=#00a0e3]csv2table[/color][/url]-csv格式讀取表格插件 [p][img]http://blog.bingo929.com/wp-content/uploads/2009/12/csv2table.jpg[/img][br] csv2table 可以讀取csv文件,它從csv文件中讀取內容并創建成table表格.[/p] 12.[url=http://neoalchemy.org/tablepagination.html][color=#00a0e3]table pagination[/color][/url]-jquery表格分頁插件 [p][img]http://blog.bingo929.com/wp-content/uploads/2009/12/table-pagination.jpg[/img][br] 這個jquery表格分頁插件可以在表格下面創建分頁元素,你還可以通過各種設置來定制分頁。[/p] 13.[url=http://pure-essence.net/stuff/webtips/jquerytablerowcheckboxtoggle.html][color=#00a0e3]jquery tablerowcheckboxtoggle[/color][/url] [p][color=#00a0e3][img]http://blog.bingo929.com/wp-content/uploads/2009/12/jquery-table-row-checkbox-toggle.jpg[/img][br][/color] 這個[url=http://blog.bingo929.com/category/technology/jquery-technology][color=#00a0e3]jquery[/color][/url]表格插件可以讓你再點擊表格行的時候改變多選框狀態并修改該行css樣式。[/p] 14.[url=http://isocra.com/2008/02/table-drag-and-drop-jquery-plugin/][color=#00a0e3]table drag and drop jquery plugin[/color][/url]-jquery表格拖拽插件 [p] 這個簡單的jquery插件可以讓用戶使用拖拽行的方式重新排列表格各行,任意單獨行可以設置為不可拖拽和/或不可放置。[/p] 15.[url=http://gregweber.info/projects/uitableedit][color=#00a0e3]uitableedit[/color][/url] [p] uitableedit是由greg weber制作的很酷的jquery表格編輯插件,它允許用戶編輯表格內容。[/p] 該文章在 2010/7/4 0:42:50 編輯過 |
關鍵字查詢
相關文章
正在查詢... |