TableSorter不工作

Question

tableSorter插件不工作。我已经下载了包含在文件中的插件。

<script type="text/javascript" src="~/Assets/js/jquery-1.10.2.js"></script>
<script type="text/javascript"     src="~/Assets/js/tablesorter/jquery.tablesorter.js"></script>

<div class="panel-body">
                    <div class="table-responsive">
                        <table id="sortTable" class="table table-bordered table-hover table-striped tablesorter">
                            <thead>
                                <tr class="danger" >
                                    <th>TOKENS</th>
                                    <th>REVISIONNOTES</th>
                                    <th>REVISION</th>
                                    <th>TARGETPROFICENCY</th>
                                    <th>QUESTIONSAVAIL</th>
                                    <th>QUESTIONSTOASK</th>
                                </tr>
                            </thead>
                            <tbody>

<script>
$(document).ready(function () {       
   $(".tablesorter").tablesorter();
});

​

​

​

当我调试代码时，它告诉我'tablesorter‘不是一个函数，基本上插件已经加载了。我不知道我做错了什么，有人能帮帮我吗？谢谢。

​

​

Answer 1

您的html代码错误。另外，我还为您实现了一个示例：

http://jsfiddle.net/xrda9p5t/

html：

<table id="sortTable" class="table table-bordered table-hover table-striped tablesorter">
<thead>
    <tr class="danger" >
        <th>TOKENS</th>
        <th>REVISIONNOTES</th>
        <th>REVISION</th>
        <th>TARGETPROFICENCY</th>
        <th>QUESTIONSAVAIL</th>
        <th>QUESTIONSTOASK</th>
    </tr>
</thead>
<tbody>
    <tr>
        <td>test </td>
        <td>test </td>
        <td>test </td>
        <td>test </td>
        <td>test </td>
        <td>test </td>
    </tr>
    <tr>
        <td>test 1</td>
        <td>test 1</td>
        <td>test 1</td>
        <td>test 1</td>
        <td>test 1</td>
        <td>test 1</td>
    </tr>
</tbody>

​

js

$(document).ready(function () {       
   $(".tablesorter").tablesorter();
 });

确保已正确添加所有文件。在html的末尾添加脚本文件是一种很好的做法。

希望能有所帮助！