相关疑难解决方法(0)

我有一个包含多个列的HTML表,我需要使用jquery实现列选择器.当用户单击复选框时,我想隐藏/显示表中的相应列.我想这样做而不将表附加到表中的每个td,有没有办法使用jquery选择整个列？以下是HTML的示例.

<table>
    <thead>
        <tr><th class="col1">Header 1</th><th class="col2">Header 2</th><th class="col3">Header 3</th></tr>
    </thead>
    <tr><td>Column1</td><td>Column2</td><td>Column3</td></tr>
    <tr><td>Column1</td><td>Column2</td><td>Column3</td></tr>
    <tr><td>Column1</td><td>Column2</td><td>Column3</td></tr>
    <tr><td>Column1</td><td>Column2</td><td>Column3</td></tr>
</table>

<form>
    <input type="checkbox" name="col1" checked="checked" /> Hide/Show Column 1 <br />
    <input type="checkbox" name="col2" checked="checked" /> Hide/Show Column 2 <br />
    <input type="checkbox" name="col3" checked="checked" /> Hide/Show Column 3 <br />
</form>

我有一个HTML表格,如http://jsfiddle.net/Lijo/auny3/所示.该表有10列 - 分为三个col组.我需要使用"Show Associate"和"Hide Associate"按钮隐藏/显示名为"Associate Info"的colgroup(包括其行数据).

使用jQuery执行此操作的最佳方式(在性能方面)是什么？

如果您有比http://jsfiddle.net/Lijo/auny3/8/更好的答案,请回答

注意:我使用ASP.Net GridView生成表格,如http://www.sacdeveloper.com/Community/Articles/tabid/86/ctl/ArticleView/mid/458/articleId/1/Group_columns_in_an_ASPNet_Gridview.aspx中给出的那样 .

参考:

1. http://jsfiddle.net/Lijo/auny3/8/

2. http://jsfiddle.net/Lijo/auny3/12/

3. http://jsfiddle.net/Lijo/auny3/11/

4. http://jsfiddle.net/Lijo/auny3/13/

选定的答案

1. http://jsfiddle.net/Lijo/UqdQp/2/

在下表中：

<table>
    <thead>
        <tr>
            <th>Th1</th>
            <th colspan='2'>Th23</th>
            <th>Th4</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>Td1</td>
            <td>Td2</td>
            <td>Td3</td>
            <td>Td4</td>
       </tr>
    </tbody>
</table>

对于包含文本“Th23”的表格单元格，我想知道它下面有哪些单元格。在这种情况下，答案将是分别包含文本“Td2”和“Td3”的单元格。

是否有任何 DOM 属性或内置函数可以帮助进行此类计算？

@Matt McDonald 有一个更通用的解决方案。

这就是我最终的结果：

// get tbody cell(s) under thead cell (first arg)
// if rowIndex===undefined, get from all rows; otherwise, only that row index
// NOTE: does NOT work if any cell.rowSpan != 1
var columnCells = function( th, rowIndex ) {
    // get absolute column for th
    for( var absCol=0, i=0; true; i++ ) { …

"我希望id:Second的索引为2(考虑#First为2列).但是在$("#Second").parent().find("td").index($("#Second"))i 的帮助下得到1. Jquery中的任何Direct函数都可以执行此操作而无需使用FOR LOOPS或.each函数或任何一种循环???"

<table>
<tr>
<td colspan="2" id="First">
</td>
<td colspan="2" id="Second">
</td>
</tr>
</table>