html怎么筛选表格列,jq表格筛选.html Examples
/* tables */
table.tablesorter {
font-family:arial;
background-color: #dad9c7;
margin:10px 0pt 15px;
font-size: 8pt;
width: 100%;
text-align: left;
}
table.tablesorter thead tr th, table.tablesorter tfoot tr th {
background-color: #e6EEEE;
border: 1px solid #FFF;
font-size: 8pt;
padding: 4px;
}
table.tablesorter thead tr .header {
background-image: url(small.gif);
background-repeat: no-repeat;
background-position: center right;
cursor: pointer;
}
table.tablesorter tbody td {
color: #3D3D3D;
padding: 4px;
background-color: #FFF;
vertical-align: top;
}
table.tablesorter tbody tr.odd td {
background-color:#F0F0F6;
}
table.tablesorter thead tr .headerSortUp {
background-image: url(small_asc.gif);
}
table.tablesorter thead tr .headerSortDown {
background-image: url(small_desc.gif);
}
table.tablesorter thead tr .headerSortDown, table.tablesorter thead tr .headerSortUp {
background-color: #8dbdd8;
}
$(document).ready(function(){
//jQuery插件:Tablesorter 2.0 -默认状态下表格参数设置
$(".table-00").tablesorter();
//jQuery插件:Tablesorter 2.0 -附加表格数据和ajax传输 以下截⽌换⾏
$(".table-01").tablesorter();
$("#ajax-append").click(function(){
$.get("docs/assets/ajax-content.html",function(html) {
// append the "ajax'd" data to the table body
$(".table-01 > tbody").append(html);
// let the plugin know that we made a update
$(".table-01").trigger("update");
// set sorting column and direction, this will sort on the first and third column
var sorting = [[0,0],[2,0]];
// sort on the first column
$(".table-01").trigger("sorton",[sorting]);
});
return false;
});
// jQuery插件:Tablesorter 2.0 - 扩展默认选项 以下截⽌换⾏
// extend the default setting to always include the zebra widget.
$.tablesorter.defaults.widgets = ['zebra'];
// extend the default setting to always sort on the first column
$.tablesorter.defaults.sortList = [[0,0]];
html如何下载
// call the tablesorter plugin
$(".table-02").tablesorter();
//jQuery插件:Tablesorter 2.0 - 禁⽤标题数据⾃定义使⽤
$(".table-03").tablesorter({
headers:{1:{sorter:false},2:{sorter:false}}
});
//jQuery插件:Tablesorter 2.0 - 加jQuery分页插件控制表格分页显⽰
$(".table-04").tablesorter({widthFixed: true}).tablesorterPager({container: $("#pager")});
});
jQuery插件:Tablesorter 2.0 -默认状态下表格参数设
First NameLast NameAgeTotalDiscountDate
ClarkKent18$15.8944%Jan 12, 2003 11:14 AMBruceAlmighty45$153.1944%Jan 18, 2001 9:12 AMJohnHood33$19.9925%Dec 10, 2002 5:14
AMPeterParker28$9.9920%Jul 6, 2006 8:14 AMBruceEvans22$13.1911%Jan 18, 2007 9:12 AM
jQuery插件:Tablesorter 2.0 -附加表格数据和ajax传输
First NameLast NameAgeTotalDiscountDate
BruceEvans22$13.1911%Jan 18, 2007 9:12 AMBruceEvans22$13.1911%Jan 18, 2007 9:12 AMBruceAlmighty45$153.1944%Jan 18, 2001 9:12
AMBruceAlmighty45$153.1944%Jan 18, 2001 9:12 AMClarkKent18$15.8944%Jan 12, 2003 11:14 AMClarkKent18$15.8944%Jan 12, 2003 11:14
AMJohnHood33$19.9925%Dec 10, 2002 5:14 AMJohnHood33$19.9925%Dec 10, 2002 5:14 AMPeterParker28$9.9920%Jul 6, 2006 8:14
AMPeterParker28$9.9920%Jul 6, 2006 8:14 AM
jQuery插件:Tablesorter 2.0 - 扩展默认选项
First NameLast NameAgeTotalDiscountDate
BruceAlmighty45$153.1944%Jan 18, 2001 9:12 AMBruceEvans22$13.1911%Jan 18, 2007 9:12 AMClarkKent18$15.8944%Jan 12, 2003 11:14
AMJohnHood33$19.9925%Dec 10, 2002 5:14 AMPeterParker28$9.9920%Jul 6, 2006 8:14 AM
jQuery插件:Tablesorter 2.0 - 禁⽤标题数据⾃定义使⽤
First NameLast NameAgeTotalDiscountDate
BruceAlmighty45$153.1944%Jan 18, 2001 9:12 AMBruceEvans22$13.1911%Jan 18, 2007 9:12 AMClarkKent18$15.8944%Jan 12, 2003 11:14
AMJohnHood33$19.9925%Dec 10, 2002 5:14 AMPeterParker28$9.9920%Jul 6, 2006 8:14 AM
jQuery插件:Tablesorter 2.0 - 加jQuery分页插件控制表格分页显⽰
NameMajorSexEnglishJapaneseCalculusGeometry
NameMajorSexEnglishJapaneseCalculusGeometryStudent01Languagesmale80707580Student02Mathematicsmale908810090Student03Languagesfemale85958085Student04L
10
20
30
⼀键复制
编辑
Web IDE 原始数据按⾏查看历史

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。