Question

我一直在寻找解决问题的方法，我确信它很简单，但我是javascript和jquery的新手。好吧，我有一个表，它的一些列应该在页面加载时隐藏，然后使用复选框使它们可见。我发现了一个jquery脚本来处理它，但只有一列。就我而言，我需要6列才能显示隐藏。这是我正在调整的Jquery脚本：

$(function(){
    $(':checkbox').on('change', function(){
        $('th, td', 'tr').filter(':nth-child(' + $(this).attr('rel') + ')').toggle();
    });
    $(":checkbox[rel='2']").change(); //this line will hide the 2nd column when the DOM is ready. Don't forget to start the corresponding hidden columns' checkboxes WITHOUT checked="checked"
});

我尝试添加更多的rel值，但它没有按预期工作。

 $(":checkbox[rel='2, 3, 4, 5, 6']").change();

这是JSFiddle的网址，其中包含我的工作示例：http://jsfiddle.net/k7zQ2/

希望你能帮助我!!! ：）

Answer 1

根据this answer，您必须指定每个选择器，而不仅仅是rel值。这样的事情最初会隐藏第2列和第3列：

$(":checkbox[rel='2'], :checkbox[rel='3']").change();

如果要在选择器中指定多个rel属性值，则不会查找具有这些值的元素，而是查找这些值的两个元素 - 如here in the jQuery documentation所述。

除此之外，看起来您的其他复选框工作正常，您只需要将rel值更改为2以外的值。这是updated fiddle。

在页面加载时隐藏表格列并使用复选框显示它们

1 个答案: