This article illustrates the implementation of the table based on jquery without refreshing paging function, share for everyone to reference, the specific contents are as follows
Effect Chart:
Specific code:
html,body{margin:0;padding:0} a:focus {Outline:none} h3.head_title {border-bottom:1px solid #d5ddeb; color: #1c7493;d
isplay:block;font-size:14px;height:30px;line-height:30px;margin-bottom:10px;} /* Universal table showing/table, TH, td {Font:12px Arial,helvetica,sans-serif, ' Arial '; margin:0;padding:0} Table{border-spacing:0;borde R-collapse:collapse;empty-cells:show}. data-table {width:100%;border-style:none;background-color: #fff; *
Margin-bottom:20px;*/text-align:left;} . data-table th,. data-table td {Padding:5px;line-height:30px}. data-table thead th {background-color: #eee; margin:0;te xt-align:left;border-top:1px solid #cfcfcf; border-bottom:1px solid #cfcfcf font-weight:500} data-table tbody td {Back Ground-color: #fff; border-bottom:1px dotted #ddd; table-layout:fixed;word-break:break-all;border-collapse:collapse font-weight:400}. data-table tbody tr.evenrow td {Background-color: #f4f4f4}. data-table tfoot td {Background-color: #f afafa;text-align:right;border-bottom:1px sOlid #cfcfcf;} /* Table pagination List/* Data-table td.paging a {border:1px solid #eee; color: #444; margin:4px; padding:2px 7px; text-decoration:n One
Text-align:center;}
/* Table pagination Current page/* data-table td.paging a.current {background: #eee; border:1px solid #CFCFCF; color: #444; font-weight:bold;} . data-table td.paging input{border:1px solid #4D90BB; font-family:arial,sans-serif,tahoma; font-size:12px; padding:0 5px;outline:none}. data-table td.paging. search-txt{height:30px;line-height:30px;width:100px} data-table td.paging . Search-btn{height:32px;border-left:none;cursor:pointer;_filter:chroma (color= #000000); _border:none}/* Table sort * *. Data-table thead th.bg{background: #eee url (".. /images/bg.gif ") Right center No-repeat;cursor:pointer}. Data-table thead Th.asc{background:url (". /images/asc.gif ") Right center No-repeat;cursor:pointer}. Data-table thead Th.desc{background:url (".
/images/desc.gif ") Right Center No-repeat;cursor:pointer}
The above is based on jquery implementation of the table without refreshing paging function of the detailed code, I hope to help you learn.