Jquery Tablesorter funktioniert nicht! Was stimmt damit nicht?

Ich bin neu in Jquery und ich versuche, Jquery Tablesorter Plugin zu verwenden, und ich habe es in einer einfachen HTML-Datei wie unten getestet, aber es funktioniert nicht. Alles, was ich im Browser gesehen habe, ist nur eine einfache Tabelle ohne Sortierung, keine anklickbare Kopfzeile, es sieht nicht so aus, wie ich es auf der Jquery Tablesorter-Homepage gesehen habe. Ich weiß nicht, was mit meinem HTML falsch ist. Ich habe 2 jquery Dateien im gleichen Ordner mit dieser HTML-Datei platziert. Bitte beraten!Jquery Tablesorter funktioniert nicht! Was stimmt damit nicht?

<html> 
<head> 
<script type="text/javascript" src="jquery-1.9.1.min.js"></script> 
<script type="text/javascript" src="jquery.tablesorter.js"></script> 
<script type="text/javascript"> 
$(document).ready(function() 
    { 
     $("#myTable").tablesorter({sortList: [[0,0], [1,0]]}); 
    } 
); 
</script> 
</head> 
<body> 
<table id="myTable" class="tablesorter"> 
<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>[email protected]</td> 
    <td>$50.00</td> 
    <td>http://www.jsmith.com</td> 
</tr> 
<tr> 
    <td>Bach</td> 
    <td>Frank</td> 
    <td>[email protected]o.com</td> 
    <td>$50.00</td> 
    <td>http://www.frank.com</td> 
</tr> 
<tr> 
    <td>Doe</td> 
    <td>Jason</td> 
    <td>[email protected]</td> 
    <td>$100.00</td> 
    <td>http://www.jdoe.com</td> 
</tr> 
<tr> 
    <td>Conway</td> 
    <td>Tim</td> 
    <td>[email protected]</td> 
    <td>$50.00</td> 
    <td>http://www.timconway.com</td> 
</tr> 
</tbody> 
</table> 
</body> 
</html>

Quelle

2013-03-30 TwentyLe

Gibt es auch keine CSS-Datei? – leppie

Ich würde auch überprüfen Sie Ihre Browser-Konsole und stellen Sie sicher, dass diese Dateien geladen werden (nur um sicher zu sein) – bruchowski

@leppie Ja, ich habe Standard-Thema enthalten css – TwentyLe

Hier ist die Arbeit Geige Link. Sie haben vergessen, die tablesorter js und tablesorter css hinzuzufügen, die ich in externen Ressourcen in jsfiddle hinzugefügt habe. Du kannst es überprüfen.

http://jsfiddle.net/BKgue/2/

Quelle

2013-03-30 05:23:30

Okay, ich habe verstanden, behoben und das hat jetzt funktioniert :). Danke Sir und danke SO! – TwentyLe

Wo ist die Dokumentation, die besagt, dass Sie Tablesorter js und Tablesorter CSS-Dateien benötigen? – DDDD

Ja ich lese die ganze Dokumentation, es gibt überhaupt keine Referenz über das Hinzufügen von salesorter.css, damit es funktioniert. macht für mich überhaupt keinen Sinn. –

Hinweis <th> innerhalb <tr> statt <td> das war, was für mich von der Arbeit gehindert.

<thead> 
    <tr> 
     <th>column 1</th> 
    <tr> 
</thead>

Auch das CSS wird nicht benötigt, damit der Tablesorter funktioniert. Wenn Sie Ihre eigene Formatierung behalten möchten, aber Sie möchten, dass die kleinen Pfeile angezeigt werden, benötigen Sie nur den folgenden Code. und kopieren Sie den 3-Pfeil-GIF, den tablesorter zur Verfügung stellt, in den gleichen Ordner wie die CSS-Datei. oder deine eigenen Pfeile, wenn du willst.

table.tablesorter thead tr .header { 
    background-image: url(bg.gif); 
    background-repeat: no-repeat; 
    background-position: center right; 
    cursor: pointer; 
} 
table.tablesorter thead tr .headerSortUp { 
    background-image: url(asc.gif); 
} 
table.tablesorter thead tr .headerSortDown { 
    background-image: url(desc.gif); 
}

Quelle

2016-10-05 02:39:34 codenoob

Jquery Tablesorter funktioniert nicht! Was stimmt damit nicht?

Antwort

Verwandte Themen