Показать не пустые строки таблицы
Здравствуйте
Есть таблица, в первом столбце есть текст с наименованием, во второй столбец динамически добавляется/удаляется текст. Изначально строки таблицы скрыты. Как сделать - показывать только те строки, в которых есть содержимое ячеек второго столбца. И не показывать строки, если ячейки второго столбцы пустые. Можно конечно каждой строке сделать отдельный класс и по условию показывать/скрывать, но строк в таблице много и соответственно будет столько же условий
<style type="text/css">
.hid {display:none;}
</style>
<input type="button" value="добавить/удалить текст" onclick="send()">
<br>
<table border="1" cellspacing="0" cellpadding="0">
<tr class="hid">
<td>Марка</td>
<td id="marka_decode" class="decode"></td>
</tr>
<tr class="hid">
<td>Модель</td>
<td id="typeGlass_decode" class="decode"></td>
</tr>
<tr class="hid">
<td>Цвет</td>
<td id="colorGlass_decode" class="decode"></td>
</tr>
</table>
<script type='text/javascript'>
function send(){
if($('#marka_decode').html() == ''){
$('#marka_decode').text('текст');
} else {
$('#marka_decode').text('');
}
if($('.decode').html() !== ''){//второе условие
$('.hid').show()
} else {
$('.hid').hide()
}
}
</script>
|
rodiony4,
<!DOCTYPE html>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style type="text/css">
</style>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script>
$(function() {
$(".btn").on("click", function() {
$(".hid").filter(function() {
return $(".decode",this).text()
}).show()
})
});
</script>
</head>
<body>
<style type="text/css">
.hid {display:none;}
</style>
<input type="button" value="добавить/удалить текст" class="btn">
<br>
<table border="1" cellspacing="0" cellpadding="0">
<tr class="hid">
<td>Марка</td>
<td id="marka_decode" class="decode"></td>
</tr>
<tr class="hid">
<td>Модель</td>
<td id="typeGlass_decode" class="decode">test</td>
</tr>
<tr class="hid">
<td>Цвет</td>
<td id="colorGlass_decode" class="decode"></td>
</tr>
</table>
</body>
</html>
|
рони, да, теперь строка показывается, а если динамически удалить текст из ячейки второго столбца, то как эту строку опять скрыть?
<script type='text/javascript'>
function send(){
if($('#marka_decode').html() == ''){
$('#marka_decode').text('текст');
} else {
$('#marka_decode').text('');
}
$(".hid").filter(function() {
return $(".decode",this).text()
}).show()
}
</script>
|
rodiony4,
а подумать? $(".hid").hide().filter |
рони, большое спасибо!
|
| Часовой пояс GMT +3, время: 05:55. |