使用jQuery隐藏html表中的空列不起作用：\\

Question

<html>
<head>
    <script  src="jquery-1.4.4.js"></script>
    <script>


        $('table').each(function(a, tbl) {
            var currentTableRows = $(tbl).attr('rows').length - 1;
            $(tbl).find('th').each(function(i) {
                var remove = 0;
                var currentTable = $(this).parents('table');

                var tds = currentTable.find('tr td:nth-child(' + (i + 1) + ')');
                tds.each(function(j) { if (this.innerHTML == '') remove++; });

                if (remove == currentTableRows) {
                    $(this).hide();
                    tds.hide();
                }
            });
        });

    </script>
</head>
<body>
    <table  border="1" >  
        <tr><td colspan="4" > alaa </td></tr>
        <tr><th>Column1</th><th>Column2</th><th>Column3</th><th>Column4</th></tr>
        <tr ><td>1st</td><td>1.1</td><td></td><td></td></tr>
        <tr class="data"><td>2nd</td><td>2.1</td><td></td><td></td></tr>  
        <tr class="data"><td>3rd</td><td>3.1</td><td></td><td>1</td></tr>  
        <tr class="data"><td>4th</td><td></td><td></td><td></td></tr>
        <tr ><td></td><td></td><td></td><td></td></tr>
        <tr class="data"><td></td><td></td><td></td><td></td></tr>  
    </table>

</body>

here is my code ... I thought that the problem from the library, so I tried many libraries such as jQuery 1.4.4 , 1.5.2 and others 这是我的代码......我认为来自库的问题，所以我尝试了很多库，比如jQuery 1.4.4,1.5.2和其他

Here is the test and it works fine there http://jsfiddle.net/nlovatt/JsLn8/ 这是测试，它在那里工作正常http://jsfiddle.net/nlovatt/JsLn8/

but in my file .. it doesn't work .. 但在我的文件..它不起作用..

regards, 问候，

Answer 1

There are two reasons your code isn't working. 您的代码无法正常工作有两个原因。

1) You're executing the script immediately upon loading of the HEAD , at this stage, your table doesn't exist and so it does nothing. 1）您在加载HEAD立即执行脚本，在此阶段，您的表不存在，因此它什么都不做。 To fix this, make sure you execute it on page load instead. 要解决此问题，请确保在页面加载时执行它。

2) When you're comparing the number of blank cells in the column with the number of total rows in the table , you're missing the fact that most of your columns don't have the same number of rows as the table (your first row is only one column wide). 2）当您将列中的空白单元格数与表格中的总行数进行比较时，您错过了大多数列与表格的行数不同的事实（您的第一行只有一列宽）。 You need to compare to the number of rows in the actual column, or better yet, just do the reverse thing and check for non-empty columns. 您需要与实际列中的行数进行比较，或者更好的是，只需执行相反的操作并检查非空列。

The full code then becomes: 完整的代码然后变成：

$(document).ready(function() {
    $('table').each(function(a, tbl) {
        $(tbl).find('th').each(function(i) {
            var remove = true;
            var currentTable = $(this).parents('table');
            var tds = currentTable.find('tr td:nth-child(' + (i + 1) + ')');
            tds.each(function(j) { if (this.innerHTML != '') remove = false; });
            if (remove) {
                $(this).hide();
                tds.hide();
            }
        });
    });
});

Answer 2

try it like this 试试这样

    $('#mytable tr th').each(function(i) {
   //select all td in this column
    var tds = $(this).parents('table')
          .find('tr td:nth-child(' + (i + 1) + ')');
    //check if all the cells in this column are empty
    if(tds.length == tds.filter(':empty').length) { 
        //hide header
        $(this).hide();
        //hide cells
        tds.hide();
    } 
    });

for hiding columns in table if all cells in column are empty 用于在列中的所有单元格为空时隐藏列中的列

使用jQuery隐藏html表中的空列不起作用：\\

问题描述

2 个解决方案

解决方案1
2 已采纳 2012-07-11 10:59:00

解决方案2
0 2012-07-11 10:49:49

使用jQuery隐藏html表中的空列不起作用：\\

问题描述

2 个解决方案

解决方案1 2 已采纳 2012-07-11 10:59:00

解决方案2 0 2012-07-11 10:49:49

解决方案1
2 已采纳 2012-07-11 10:59:00

解决方案2
0 2012-07-11 10:49:49