如何 - 如果 div 有子 div，扩展这个 div？答案

【问题标题】：How to - if div has child div, expand this div?如何 - 如果 div 有子 div，扩展这个 div？
【发布时间】：2014-05-09 15:14:58
【问题描述】：

因此，如果手风琴 div 有信息/主体，我该如何提醒呢？信息是动态加载的，如果 div 有信息（不是全部都有） - 它看起来像这样：

<div class="panel panel-default">
    <div class="panel-heading"></div>
    <div id="collapse_1" class="accordion-body collapse"></div>
</div>

...否则是

<div class="panel panel-default">
    <div class="panel-heading"></div>
</div>

所以，如果我单击的 div 的图标有一个 .accordion-body 类的孩子...我该如何使用 jQuery 来遍历它？到目前为止，我的想法是：

$('.accordion-toggle > i').click(function () {
    if ($(this).closest('.panel-default').has('div.accordion-body')) {
        //var open = $(this).toggleClass('fa-chevron-down fa-chevron-up');
        //$.toggle('open');
        alert('expandable section')
    } else {
        alert('nothing to expand')
    }
});

提前致谢。

【问题讨论】：

.has() 返回一个 jQuery 对象，所以它总是真实的......你需要检查.has(...).length
.accordion-toggle > i 元素放置在哪里
您可能不想使用点击功能——还有其他触发手风琴的方法可能会绕过您的功能。相反，在手风琴表演事件上使用回调。
在.panel-heading中
另外，我认为这不会带来良好的用户体验。您不想提醒人们死亡，如果正文中没有内容，最好将您的“空”消息放在那里并进行扩展。没有结果的点击令人困惑。为什么不在那里放置一个默认的“空”消息，该消息会被正文覆盖？

标签： javascript jquery class if-statement

【解决方案1】：

$('.accordion-toggle > i').click(function () {                   
    if ($(this).closest(".panel-default").children("div").hasClass('accordion-body')) {
       //var open = $(this).toggleClass('fa-chevron-down fa-chevron-up');
       alert('expandable section')
    }else{
       alert('nothing to expand')
    }
});

【讨论】：

.children("div.accordion-body").length > 0 可能会更有效。 .hasClass 必须测试上面的每个孩子