jQuery的：隐藏空表行

Question

我想写的是检测是否有表td s为空的脚本，如果他们隐瞒我搜索堆栈溢出，发现其他脚本，但似乎没有父tr

为我工作。

到目前为止，我有：

$(".table tr").each(function() {       

    var cell = $(this).find('td').html();  

    if (cell == null){ 
    console.log('empty'); 
    $(this).parent().addClass('nodisplay'); 
    } 

    }); 

但就是无法得到它的工作。任何意见，将不胜感激！

小提琴：http://jsfiddle.net/MeltingDog/S8CUa/1/

Answer 1

.html()只返回第一个匹配元素的内容，因此，如果您行有一个以上的小区这不会工作。 .text()可能是更好的修复方法，除非在单元格中有图像或其他空标记。

$("table tr").each(function() {   
    var cell = $.trim($(this).find('td').text()); 
    if (cell.length == 0){ 
     console.log('empty'); 
     $(this).addClass('nodisplay'); 
    }     
}); 

DEMO

Answer 2

试试这个 -

$("table tr td").each(function() {        
    var cell = $(this);   
    if ($(cell).text().length == 0){ 
     console.log('empty'); 
     $(this).parent().addClass('nodisplay'); 
    }  
}); 

Demo

Answer 3

$('table tr').each(function(){ 

    var hide = true; 

    $('td',this).each(function(){ 

     if ($.trim($(this).text()) != "") 
      hide = false; 

    }); 

    if(hide) 
     $(this).closest('tr').hide(); 
     // OR $(this).closest('tr).addClass('nodisplay'); 

}); 

Answer 4

你应该试试这个。

jQuery(document).ready(function(e) { 
    jQuery(jQuery('table tr td:empty').parents('tr')).addClass('nodisplay'); 
}); 

Answer 5

看来你想隐藏只有空白内容（但单元格可能有其他元素子节点）的行。使用普通的JavaScript：

var rows = document.getElementsByTagName('tr'); 
var i = rows.length; 
while (i--) { 
    if (!trim(getText(rows[i]))) { 
    rows[i].className += ' nodisplay'; 
    } 
} 

助手：

function trim(s) { 
    return s.replace(/(^\s*)|(\s*$)/g, ''); 
} 

function getText(el) { 
    if (typeof el.textContent == 'string') { 
    return el.textContent; 
    } else if (typeof el.innerText == 'string') { 
    return el.innerText; 
    } 
}