переключать отображение тега p в зависимости от значения внутри

0

Я предполагаю, что это не должно быть слишком сложно решить, но я в значительной степени новичок, когда дело доходит до Javascript или JQuery.

HTML:

<p><span id="AddLine1Summary"></span>,</p>
<p><span id="AddLine2Summary"></span>,</p>
<p><span id="TownCitySummary"></span>,</p>
<p><span id="CountySummary"></span>,</p>
<p><span id="PostcodeSummary"></span></p>

Когда клиент не заполняет адресную строку 2, по-прежнему присутствует значение "," поэтому на сводной странице оно выглядит так:

12 Bob Street,
,
BOLTON,
Lancashire,
BL1 1AC

Поэтому я пытаюсь избавиться от всей строки <p><span id="AddLine2Summary"></span>,</p> когда клиент оставляет этот пробел. До сих пор я пытался и пришел к такому:

<script>
$(document).ready(function () {

if ($('#AddLine2Summary:contains(",")').length == 1) {
    $("#AddLine2Summary").parent().hide();
}

});
</script>

parent.hide потому что мне нужно скрыть все <p> не только <span>

2 ответа

0

Вместо проверки длины "," вы также можете проверить текст внутри диапазона, который имеет ID AddLine2Summary. И если он пуст, вы можете поместить код скрытия родителя.

Он должен выглядеть так:

if ($('#AddLine2Summary').is(':empty')) {
    $("#AddLine2Summary").parent().hide();
}
0

Во-первых, попробуйте обернуть свой фрагмент HTML в контейнере, чтобы сделать выбор проще:

<div class="address-container">
    <p><span id="AddLine1Summary"></span>,</p>
    <p><span id="AddLine2Summary"></span>,</p>
    <p><span id="TownCitySummary"></span>,</p>
    <p><span id="CountySummary"></span>,</p>
    <p><span id="PostcodeSummary"></span></p>
</div>

Затем в jQuery найдите здесь пустые элементы span и скройте их родительские p.

$('.address-container span:empty').closest('p').hide();

Пример скрипки

Затем это будет работать для всех пустых полей адреса, а не только для #AddLine2Summary.

Ещё вопросы

Сообщество Overcoder
Наверх
Меню