3

我正在使用具有结构的表

<table cellspacing="0" cellpadding="3" rules="cols" border="1" id="ctl00_Content_GrdCustomer" style="color:Black;border-color:#999999;width:640px;border-collapse:collapse;">
    <tr style="color:White;background-color:Black;font-weight:bold;">
        <th scope="col">Something</th>
        <th scope="col">Client Name</th>
        <th scope="col">Address</th>
        <th scope="col">Place</th>
        <th scope="col">City</th>
        <th scope="col">Country</th>
    </tr>
    <tr class="home-history-grid-row customerData">
        <td align="center" style="width:50px;"><!--Checkbox Goes Here--></td>
        <td align="center">Raju Varghese</td>
        <td align="center">&nbsp;</td>
        <td align="center">&nbsp;</td>
        <td align="center">&nbsp;</td>
        <td align="center">Country4</td>
    </tr>
    <tr class="home-history-grid-row customerData">
        <td align="center" style="width:50px;"><!--Checkbox Goes Here--></td>
        <td align="center">Joseph K. J</td>
        <td align="center">&nbsp;</td>
        <td align="center">&nbsp;</td>
        <td align="center">&nbsp;</td>
        <td align="center">Country4</td>
    </tr>
</table>

我需要根据标题为“客户名称”的“th”对表格进行排序。浏览了这么多链接,所有链接都根据标题点击进行排序,我不太了解 javascript。请帮助

4

3 回答 3

4

如果您不太了解javascript,那么我推荐tablesorter:

tablesorter.com

确保包含 jQuery,然后包含 tablesorter JS 和 CSS 文件。您还需要将头部包裹在标签中,将主体包裹在标签中。网站上的文档包含您需要的所有信息

于 2012-07-20T03:51:11.010 回答
1

我不确定您的确切情况是什么,因为您的帖子缺乏细节,但我认为您可能会发现另一种更易于管理的方法。

如果可以,您应该在 JavaScript 中创建一个二维数组,[6][n]其中包含您计划在表中存储的条目数。创建数组后,将所有数据硬编码到数组中。一旦您在数组中获得数据,您要做的就是对相应的行进行排序,然后使用 for 循环填充一个 html 表。

这种方法会减少很多麻烦,因为您不必担心从 HTML 页面加载数据,然后用新生成的表格替换整个表格,就像您当前的方法需要的那样。

如果您有任何问题或需要在下面进一步澄清评论。

干杯和快乐编码!

于 2012-07-20T03:48:58.093 回答
0

听起来您只想根据特定列对表格进行排序,而无需用户单击以启动它。

您可以使用 DataTables 执行此操作。当你初始化数据表时,你可以指定它应该在哪一列上排序:

$(document).ready(function() {
oTable = $('#ctl00_Content_GrdCustomer').dataTable( {
    "aaSorting": [[ 1, "asc" ]]
} );

});

该 API 还包括函数 fnSort,您可以在初始化后使用该函数对其进行重新排序,您只需要执行如下调用即可随时对其进行重新排序:

 // Sort immediately with columns 0 and 1
 oTable.fnSort( [ [0,'asc'], [1,'asc'] ] );
于 2012-07-20T06:35:09.807 回答