如果子 div 没有 html，则隐藏父 div

Question

如果子 div 没有内容，我一直在寻找隐藏父 div 的不同方法，我已经让它在一些小提琴中工作，但在我的实际网站上似乎没有任何工作。

我正在编辑 Wordpress 插件 CPT Bootstrap 轮播，我添加了一个用于显示推荐的新自定义字段，但目前只有一个来自客户的推荐，因此希望在 div 为 emtpy 时隐藏按钮。

这是该页面的链接：http://rookdesigns.co.uk/portfolio/

这是我的 html 和 jQuery：

<div class="test btn btn-primary">Testimonials>>
    <div class="carousel-quotes">
        <?php echo $image[ 'reff']; ?>
    </div>
</div>



jQuery(".carousel-quotes:empty").parent().hide();

我也在用这个jQuery来淡化打开和关闭子div

jQuery(".test").click(function(){
jQuery('.carousel-quotes').fadeToggle();

不确定这是否会产生影响。

非常感谢任何帮助，

提前致谢

一切顺利

哈利

Answer 1

:empty 不工作，因为有一个文本节点。

您可以更改 PHP 以便在 div 为空时没有空格，或者您可以使用 filter：

jQuery(".carousel-quotes").filter(function() {
    return !$.trim($(this).text());
}).parent().hide();

或者实际上，对于您的具体用例，我们可以避免在过滤函数中调用$() 和text()：

jQuery(".carousel-quotes").filter(function() {
    return !$.trim(this.innerHTML);
}).parent().hide();

Answer 2

如果 JavaScript 是您可以接受的解决方案，那么这个 sn-p 应该可以工作：

工作 DEMO

JS

        var ln = $.trim($('.carousel-quotes').text()); /* trim is important here to remove any white space inside the div */
        if (ln.length === 0) 
        {
            $('.test').hide();
        }

编辑

您的页面中存在 JS 错误，这可能是导致问题的原因：

'fadeSpeed'     : 2000,
'targetHeight'  : 100%
'effect'        : 'effect-6'
'direction'     : 'vertical'

上述值中缺少,，

'fadeSpeed'     : 2000,
'targetHeight'  : 100%,
'effect'        : 'effect-6',
'direction'     : 'vertical'

修正后检查是否有效！