Question

我想点击每个列标题中的表格内容。

这个问题已经在jQuery table header sort进行了，但jquery插件指出那里（实际上非常好）适用于表格html标签。如果我的表是用div编写的，那么是否有一个插件可以完全相同。

Html示例：

<div class="table">
    <div class="header">
        <div class="col1">col1</div>
        <div class="col2">col2</div>
        <div class="col3">col3</div>        
    </div>    
    <div class="item">
        <div class="col1">content11</div>
        <div class="col2">content21</div>
        <div class="col3">content31</div>            
    </div>
    <div class="item">
        <div class="col1">content12</div>
        <div class="col2">content22</div>
        <div class="col3">content32</div>            
    </div>
</div>

Answer 1

如果您无法自己编写代码，那么自己编写代码的基本过程如下。可能听起来很痛苦，但如果您的数据很干净，jQuery的选择器将真正帮助您：

遍历您的数据网格，为每个单元格分配2个类别（一个对该行唯一，另一个对该列唯一）。嵌套循环可以和jQuery的.addClass()一起使用。稍后您将需要这些作为jQuery选择器。我会在此迭代中包含表头，但为它们指定“label”类。
使每个表格标题$(".label")可点击。
单击$(.label)时，获取行或列的类名，然后选择所有匹配的单元格。迭代这个数组（html元素），并创建每个单元格包含的第二个数据数组（也许通过.html()）。对此数组进行排序，然后使用它来重新填充原始元素数组，这样就很好了。

可能听起来很复杂，但是jQuery真的是为这类东西而构建的。祝你好运。

用div做的表中的jQuery头排序

1 个答案: