对页面上的每个表运行Jquery函数

对页面上的每个表运行Jquery函数,jquery,wordpress,function,Jquery,Wordpress,Function,我有多个从wp中的一个循环生成的表,并编写了jquery来删除带有空td的列,这对第一个表有效,然后在所有其他表上添加相同的列。我曾尝试将'each'与jquery一起用于每个表,但没有 例如: 每个表有1行,列数相同(7)。空列是隐藏的,这适用于单个表。假设表1有2个可见列,表2有3个可见列。。第三列(来自表2)被添加到表1中,即使它是空的 这是我的jquery $(document).ready(function() { $('.man-table').each(funct

我有多个从wp中的一个循环生成的表,并编写了jquery来删除带有空td的列,这对第一个表有效,然后在所有其他表上添加相同的列。我曾尝试将'each'与jquery一起用于每个表,但没有

例如:

每个表有1行,列数相同(7)。空列是隐藏的,这适用于单个表。假设表1有2个可见列,表2有3个可见列。。第三列(来自表2)被添加到表1中,即使它是空的

这是我的jquery

    $(document).ready(function() {

    $('.man-table').each(function (table) {
        //count # of columns
        var numCols = $("th", table).length;
        for ( var i=1; i<=numCols; i++ ) {
            var empty = true;
            //grab all the <td>'s of the column at i
            $("td:nth-child(" + i + ")", table).each(function(index, el) {
                //check if the <span> of this <td> is empty
                if ( $("span", el).text() != "" ) {
                    empty = false;
                    return false; //break out of each() early
                }
            });
            if ( empty ) {
                $("td:nth-child(" + i + ")", table).hide(); //hide <td>'s
                $("th:nth-child(" + i + ")", table).hide(); //hide header <th>
            }
        }
    })
});
$(文档).ready(函数(){
$('.man table')。每个(函数(表){
//列数
var numCols=$(“th”,表).length;

对于(var i=1;i,这里有一个基本示例,它可以处理多个表,并将标识一个“空”列。这假设该表只有一行

$(函数(){
函数findEmptyCol(t){
var cols=[];
$(“tbody td”,t)。每个(功能(i,c){
如果($(c).text().trim()==“”){
cols.push($(c.index());
}
});
返回cols;
}
函数hideEmptyCol(表){
表。每个(功能(i,t){
var e=芬代派克(t);
如果(如长度){
$。每个(e,函数(k,v){
$(“th”,t).eq(v).hide();
$(“td”,t).eq(v).hide();
});
}
});
}
hideEmptyCol($(“.man表”);
});

表1
第1列
第2列
第3列
第4列
第5列
第6栏
第7栏
1.
2.
3.
4.
5.
6.
7.
表2
第1列
第2列
第3列
第4列
第5列
第6栏
第7栏
1.
3.
4.
6.
7.
表3
第1列
第2列
第3列
第4列
第5列
第6栏
第7栏
1.
2.
3.
4.
5.
7.

欢迎使用堆栈溢出。问题尚不清楚。在您的示例中,您建议表1有2列,而表2有3列。在这种情况下,您希望隐藏第3列?如果表1有5列,而表2只有2列,您希望发生什么?如果您想隐藏列,您可能希望将它们添加到
clas中s
以便于选择。例如:
class=“col-1 numeric”
如果确定需要隐藏列,则可以
$(.col-3”,table)。hide()
轻松。@Twisty每个表都应该隐藏空列。它们应该相互独立。就像我说的。在一个表中隐藏空列很好…但是如果页面上有多个表,它会将包含大多数列的表的列添加到所有表中。这有意义吗?如何知道一列何时为空?如果是空的表格中一行的单元格不是空的,但该列中的所有其他单元格都是空的,应该隐藏吗?@Twisty每个表格只有一行。因此,如果任何单元格是空的,则该列应该隐藏。我编辑了上面的文本…就是这样!它现在按预期工作了!我想我是想得太多了。非常感谢!@jasone great!希望您能标记将其作为答案并投票表决。
        <table class='man-table'>
        <thead>
        <tr>
            <th class='numeric'><span>inductance (r)</span></th>
            <th class='numeric'><span>mount</span></th>
            <th class='numeric'><span>dim (mm)</span></th>
            <th class='numeric'><span>r current</span></th>
            <th class='numeric'><span>impedance</span></th>
            <th class='numeric'><span>capacitance</span></th>
            <th class='numeric'><span>resistance</span></th>
            <th class='numeric'><span>spec</span></th>
        </tr>
        </thead>
        <tr>
            <td data-title='inductance (r)' class='numeric'><span>{$ind}</span></td>
            <td data-title='mount type' class='numeric'><span>{$mnt}</span></td>
            <td data-title='dimensions' class='numeric'><span>{$dim}</span></td>
            <td data-title='rated current' class='numeric'><span>{$rat}</span></td>
            <td data-title='impedance' class='numeric'><span>{$imp}</span></td>
            <td data-title='capacitance' class='numeric'><span>{$cap}</span></td>
            <td data-title='resistance' class='numeric'><span>{$res}</span></td>
            <td data-title='spec sheet' class='numeric'><span><a href='{$site_url}/product-spec/{$prod_pdf}' target='_blank;'><div id='spec-btn'>DOWNLOAD</div></a></span></td>
        </tr>
    </table>