Heim  >  Artikel  >  Web-Frontend  >  Verwenden von jquery.sortElements zum Implementieren von JavaScript-Fähigkeiten zur Tabellensortierung

Verwenden von jquery.sortElements zum Implementieren von JavaScript-Fähigkeiten zur Tabellensortierung

WBOY
WBOYOriginal
2016-05-16 16:50:15886Durchsuche

Die Tabellensortierfunktion muss im Projekt implementiert werden.

Es gibt viele Lösungen online, viele davon basieren auf jQuery.

jquery.tablesorter, Größe 17 KB, aber seine Homepage weist einige Kompatibilitätsprobleme unter IE10 auf.
Datentabellen, 75 KB groß, leistungsstark, mit Paging-, Such- und anderen Funktionen.
Es gibt auch ein Plug-In namens sortElements, das mit nur 3 KB sehr klein ist, eine gute Kompatibilität aufweist und auf Github 818 Sterne hat.

Schließlich habe ich mich für sortElements entschieden, die Implementierung ist sehr einfach:

1. Führen Sie jQuery ein

Code kopieren Der Code lautet wie folgt:


2. Einführung sortElements.js




js-Code


$(document).ready(function(){
var table = $(' #mytable');//Tabellen-ID
$('#sort_header')//Zu sortierende Header-ID
.each(function(){
var th = $(this),
thIndex = th.index(),
inverse = false;

th.click(function(){
table.find('td').filter(function(){
return $(this).index() === thIndex;
}).sortElements(function(a, b){
return $.text([a]) > $.text([b]) ?
inverse ? -1 : -1;
return this.parentNode;
inverse = ! invers;

});

}); >Code kopieren


Der Code lautet wie folgt:


id="sort_header">Name der EinrichtungTelefonnummer th>Speciality td>
...
Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn