jQuery排序插件tableSorter使用方法
更新時(shí)間：2017年02月10日 15:57:01 作者：無盡空虛
這篇文章主要為大家詳細(xì)介紹了jQuery排序插件tableSorter的使用方法，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
本文實(shí)例為大家分享了jQuery排序插件tableSorter的使用方法，供大家參考，具體內(nèi)容如下
1.先引兩個(gè)js
<script type="text/javascript" src="../js/jquery-1.3.2.min.js"></script> <script type="text/javascript" src="../js/jquery.tablesorter.min.js"></script>
注意：表格要用thead/th和tbody。如：
<table id="myTable"> <thead> <tr> <th>Last Name</th> <th>First Name</th> <th>Email</th> <th>Due</th> <th>Web Site</th> </tr> </thead> <tbody> <tr> <td>Smith</td> <td>John</td> <td>jsmith@gmail.com</td> <td>$50.00</td> <td>http://www.jsmith.com</td> </tr> <tr> <td>Bach</td> <td>Frank</td> <td>fbach@yahoo.com</td> <td>$50.00</td> <td>http://www.frank.com</td> </tr> </tbody> <table>
3.調(diào)用排序js代碼
<script type="text/javascript">
$(document).ready(function() {
$("#mytable").tablesorter();
});
</script>
再回到頁面點(diǎn)擊第一行就可以進(jìn)行排序了.
ps:
1.一定要引jQuery包，所有jq插件都是基于jQuery包的
2.如果想指定哪一欄不排序這樣寫
$("#mytable").tablesorter({headers:{5:{sorter:false}}});
第5列的sorter為false就OK了
以上就是本文的全部內(nèi)容，希望對(duì)大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。
您可能感興趣的文章:
相關(guān)文章
jQuery 獲取、設(shè)置HTML或TEXT內(nèi)容的兩種方法
這篇文章主要介紹了jQuery 獲取、設(shè)置HTML或TEXT內(nèi)容的兩種方法,需要的朋友可以參考下2014-05-05
本篇文章主要是對(duì)jquery取消選擇select下拉框示例代碼進(jìn)行了介紹，需要的朋友可以過來參考下，希望對(duì)大家有所幫助2014-02-02
JQuery實(shí)現(xiàn)鼠標(biāo)滑過顯示導(dǎo)航下拉列表
我們往往是將同一級(jí)目錄下的欄目先隱藏起來，當(dāng)用戶的鼠標(biāo)滑過時(shí)則顯示出來。這就是用javascript實(shí)現(xiàn)的一個(gè)導(dǎo)航欄下拉列表，下面為大家講解下是如何實(shí)現(xiàn)的2013-09-09
今天看到google圖片搜索結(jié)果頁面，感覺簡潔實(shí)用，于是用jquery粗略的模仿了一下再次感覺到j(luò)query的強(qiáng)大和易用，基本思路初步實(shí)現(xiàn)了，再整合ajax和json，應(yīng)該可以做一個(gè)簡單的應(yīng)用了 :)2009-12-12
jQuery實(shí)現(xiàn)訂單提交頁發(fā)送短信功能前端處理方法
這篇文章主要介紹了jQuery實(shí)現(xiàn)訂單提交頁發(fā)送短信功能前端處理方法,涉及jQuery響應(yīng)鼠標(biāo)事件及針對(duì)頁面元素的樣式與字符串正則操作相關(guān)技巧,需要的朋友可以參考下2016-07-07
多功能jQuery樹插件zTree實(shí)現(xiàn)權(quán)限列表簡單實(shí)例
這篇文章主要介紹了多功能jQuery樹插件zTree實(shí)現(xiàn)權(quán)限列表簡單實(shí)例，優(yōu)異的性能、靈活的配置、多種功能的組合，是樹插件zTree最大的優(yōu)勢(shì)，感興趣的小伙伴們可以參考一下2016-07-07
jquery彈層類代碼分享，大家參考使用吧2013-12-12
jquery插件方式實(shí)現(xiàn)table查詢功能的簡單實(shí)例
下面小編就為大家?guī)硪黄猨query插件方式實(shí)現(xiàn)table查詢功能的簡單實(shí)例。小編覺得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2016-06-06
基于Jquery的淡入淡出的特效基礎(chǔ)練習(xí)實(shí)現(xiàn)代碼，學(xué)習(xí)jquery的朋友可以參考下。2010-12-12
這篇文章主要介紹了jQuery實(shí)現(xiàn)字符串全部替換的方法,結(jié)合實(shí)例形式對(duì)比分析了使用Replace進(jìn)行替換的方法及使用正則進(jìn)行全部替換的相關(guān)操作技巧,需要的朋友可以參考下2016-12-12