javascript - 基于colgroup col id的jQuery .Toggle()

小提琴是here。

我无法通过colgroup的col ID来获取实际列以进行切换。我的索引正确匹配，但是我不明白如何使用colgroup的功能来获取整个列。这是我当前的尝试（一直在小提琴的底部）：

    //Column Button Hider
    $('fieldset.techtable input.column[type=checkbox]').on('change', function() {
        var index = $(this).prevAll('input.column').length+2;
        console.log(index);
        $('fieldset.techtable' #col'+index').toggle()
            //($('#col'+index).toggle());
    });

这是表格和列组：

<section class="techtable">
        <h1>Technologies / Compliance / Certifications</h1>
        <table cellspacing="0">
            <colgroup>
                <col id="col0">
                <col id="col1">
                <col id="col2">
                <col id="col3">
                <col id="col4">
                <col id="col5">
                <col id="col6">
            </colgroup>
            <thead>
                <tr>
                    <th>Category</th>
                    <th>Skill</th>
                    <th>Version(s)</th>
                    <th>Start Date</th>
                    <th>End Date</th>
                    <th>Elapsed Time</th>
                    <th>Expertise Rating</th>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <td>Technology</td>
                    <td>J2EE</td>
                    <td>1.5, 1.6, 1.7</td>
                    <td>November, 2011</td>
                    <td></td>
                    <td></td>
                    <td>2</td>
                </tr>
                </tr>...repeating...</tr>
            </tbody>
        </table>
    </section>

我想尝试利用colgroup的功能，但是不确定我是否应该使用类ID（如果是，则使用col组ID上的<th>？或每个<td>？）。

<th>是否干扰<colgroup>？也许措辞更好，我应该参考th而不是尝试使用colgroup吗？

在正确的语法方向上讲一点很有帮助，并且总是很乐意提供帮助的代码行，但是对于这一点，我试图避免将其扩展为更多的代码行，除非我忽略了方法论。我以为我不只是正确地获取了col id，而且您的反馈可能会证明我错了。

最佳答案

如果您要隐藏特定的数据列，则在colgroup中隐藏col不会这样做。

var colIndex = 0; // first column
$(myTable).find("td,th").filter(":nth-child(" + (colIndex+1) + ")").toggle();

我已修改此代码以使用您的表。这是更新的fiddle

 var index = $(this).prevAll('input.column').length+2;
 $('colgroup').parent('table').find("td,th").filter(":nth-child(" + (index+1) + ")").toggle();

关于javascript - 基于colgroup col id的jQuery .Toggle()，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/10986414/