javascript - 使用 html div 和 javascript 隐藏字段

Question

我对 Javascript 非常陌生，但希望有人可以就以下问题提出建议。 我有以下 div 类，如果缺少 {retreat_dates} 字段，部分要求是隐藏整个 div 及其所有子 h2 字段，有人可以指出我正确的方向吗？

    <div class="grid_3 retreatextradetails">

        <h2>Retreat dates</h2>
        <p>
        {retreat_dates}{date}<br />{/retreat_dates} 
        </p>
        <div class="hr"></div>
        <h2>Age range</h2>
        <p>{retreat_age}</p>

        <div class="hr"></div>

        <h2>Fitness level</h2>
        <p>{retreat_fitness}</p>

        <div class="hr"></div>

        <h2>No. of places</h2>
        <p>{retreat_places}</p>

        <div class="hr"></div>

        <h2>Retreat Prices</h2>
        <table>
        {retreat_prices}
        <tr>
            <td class="cell_title">{description}</td>
            <td class="price">{price}></td>
        </tr>
        {/retreat_prices}
        </table>
    </div>

这是我正在使用的相应 javascript，但它不起作用:

</script>
$("#filterTextBox").on("keyup", function () {
    var search = this.value;
    $(".grid_3 retreatextradetails").show().filter(function () {
        return $(".retreat_dates", this).text().indexOf(search) < 0;
    }).hide();        
});
<script type="text/javascript">

Answer 1

尝试后可以在javascript文件中添加函数。

$('.retreatextradetails').find("h2").each(function() {
    if($(this).next('p').html().trim().indexOf("{retreat_dates}")==-1){
        $(this).hide();
        $(this).next('p').hide();
        $(this).next('div').hide();

    }

});

希望对你有所帮助。