Question

我假设这不应该太难解决，但是当谈到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

因此，当客户留空时，我试图摆脱整行,。到目前为止，我已经尝试过这个：

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

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

});
</script>

parent.hide因为我必须隐藏整个而不仅仅是

Answer 1

您还可以检查具有ID AddLine2Summary的span内的文本，而不是检查“，”的长度。如果它是空的，你可以把隐藏父代码。

应该看起来像：

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

Answer 2

首先，尝试将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();

Example fiddle

这将适用于所有空地址字段，而不仅仅是#AddLine2Summary。

根据内部值切换p标签的显示

2 个答案: