Скрыть полный столбец, если данные являются пустыми или пустыми, используя jquery

Я хотел бы скрыть полный столбец, включая заголовок, если данные пустые или нулевые. Я попытался сделать это с помощью jquery, но я не смог выполнить то, что пытаюсь сделать. В основном я получаю некоторые записи в PHP. Некоторые столбцы не имеют данных, поэтому мне не нужно показывать пустые данные или данные NULL. Может ли кто-нибудь вести меня о том, что делает ошибка.Скрыть полный столбец, если данные являются пустыми или пустыми, используя jquery

<html> 

<head> 
<title>Hide</title> 
<script type="text/javascript" src="http://code.jquery.com/jquery-1.6.2.js"></script> 
</head> 

<body> 

<table border="1" width="100%" id="mytable"> 
    <thead> 
    <tr> 
    <th>Head1</th> 
    <th>Head2</th> 
    <th>Head3</th> 
    </thead> 
    </tr> 

<tr> 
<td>aa</td> 
<td></td> 
<td>cc</td> 
</tr> 
<tr> 
<td>aa</td> 
<td></td> 
<td>cc</td> 
</tr> 
<tr> 
<td>aa</td> 
<td></td> 
<td>cc</td> 
</tr> 
</table> 

</body> 

</html> 
<script type='text/javascript'> 
$(window).load(function(){ 
$('#mytable > tbody > tr td:empty').parent().hide() 
if($td.text() == ''){ 
    $(this).hide(); 
    } 
}); 

}); 

</script>

источник

2016-03-17 Sanju Menon

Ты прячешься всю строку, если есть пустая ячейка в ней. – Barmar

Я не хорошо разбираюсь в jquery. так что вы хотите сказать, что мне нужно давать имена каждому тд? –

Я имею в виду, что вы не можете использовать переменную типа '$ td' до тех пор, пока вы не присвоите ей значение. – Barmar

Ваш селектор находит любую пустую ячейку в таблице, а затем она скрывает всю строку, которая содержит его, так как родитель td является tr. Вам нужно пройти через столбцы и проверить, все ли ячейки в этом столбце пусты. Затем скройте все ячейки в этом столбце.

$(document).ready(function() { 
 
    var columns = $("#mytable > tbody > tr:first > td").length; 
 
    for (var i = 0; i < columns; i++) { 
 
    if ($("#mytable > tbody > tr > td:nth-child(" + i + ")").filter(function() { 
 
     return $(this).text() != ''; 
 
    }).length == 0) { 
 
     $("#mytable > tbody > tr > td:nth-child(" + i + "), #mytable > thead > tr > th:nth-child(" + i + ")").hide(); 
 
    } 
 
    } 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<table border="1" width="100%" id="mytable"> 
 
    <thead> 
 
    <tr> 
 
     <th>Head1</th> 
 
     <th>Head2</th> 
 
     <th>Head3</th> 
 
    </tr> 
 
    </thead> 
 

 

 
    <tr> 
 
    <td>aa</td> 
 
    <td></td> 
 
    <td>cc</td> 
 
    </tr> 
 
    <tr> 
 
    <td>aa</td> 
 
    <td></td> 
 
    <td>cc</td> 
 
    </tr> 
 
    <tr> 
 
    <td>aa</td> 
 
    <td></td> 
 
    <td>cc</td> 
 
    </tr> 
 
</table>

источник

2016-03-17 09:23:38 Barmar

Thanx. Его работа прекрасна. Получил небольшое разъяснение. Селектор находит только пустые ячейки или может также найти NULL? –

'.text()' всегда возвращает строку. Если ячейка пуста, она возвращает '' ''. – Barmar

В HTML нет таких данных, как 'NULL'. – Barmar

Скрыть полный столбец, если данные являются пустыми или пустыми, используя jquery

ответ

Смежные вопросы