jQuery tablesorter对我不起作用

时间:2015-06-09 18:10:42

标签: jquery html tablesorter

我试图学习jQuery和tablesorter(http://mottie.github.io/tablesorter/docs/)引起了我的注意。我想知道我是否可以使用它。我一开始就遇到问题。

这是我的HTML代码,它对我来说并不合适。帮助初学者?



 $(function() {
   $("#myTable").tablesorter({
     sortList: [
       [0, 0],
       [1, 0]
     ]
   });
 });

<link href="https://cdnjs.cloudflare.com/ajax/libs/jquery.tablesorter/2.22.1/css/theme.default.min.css" rel="stylesheet" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.tablesorter/2.22.1/js/jquery.tablesorter.widgets.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.tablesorter/2.22.1/js/jquery.tablesorter.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

<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>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>
    <tr>
      <td>Doe</td>
      <td>Jason</td>
      <td>jdoe@hotmail.com</td>
      <td>$100.00</td>
      <td>http://www.jdoe.com</td>
    </tr>
    <tr>
      <td>Conway</td>
      <td>Tim</td>
      <td>tconway@earthlink.net</td>
      <td>$50.00</td>
      <td>http://www.timconway.com</td>
    </tr>
  </tbody>
</table>
&#13;
&#13;
&#13;

1 个答案:

答案 0 :(得分:2)

我将您的代码复制到了测试中(Here),它似乎表现正常。

<script type="text/javascript" src="js/tablesorter/js/jQuery/jquery-1.11.3.min.js"></script>
<script type="text/javascript" src="js/tablesorter/js/jquery.tablesorter.js"></script>
<script type="text/javascript" src="js/tablesorter/js/jquery.tablesorter.widgets.js"></script>

您是否验证了所使用的所有引用库的路径?如果您是使用tablesorter的绝对初学者,那么主库中的示例可能很方便(Here)。