首页 > 解决方案 > 标签为空时如何隐藏?

问题描述

我想创建一个函数,如果它是空的,我将能够隐藏一个选项卡,基于选项卡的content-id.

$(function() {
  $('.bdt-switcher-item-content').children().each(function() {
    if ($(this div).is(':empty'))
      $('div[content-id="' + $(this).attr('content-id') + '"]').hide();
  });
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="bdt-switcher-wrapper">
  <div id="bdt-tab-content-a49ef84" class="bdt-switcher bdt-switcher-item-content">
    <div content-id="tab-1" class="">
      <div></div>
    </div>
    <div content-id="tab-2" class="bdt-active">
      <div>I am tab #2 content</div>
    </div>
    <div content-id="tab-3" class="">
      <div> I am tab #3 content.</div>
    </div>
  </div>
</div>

标签: javascripthtmljquery

解决方案


我认为你在这里错了:

$(this div)

看我的例子,你必须在使用它之前声明你想要的东西,在这种情况下是“div”。工作示例:

$(function() {
  $('.bdt-switcher-item-content').children().each(function() {
    if ($("div",this).is(':empty'))
      $('div[content-id="' + $(this).attr('content-id') + '"]').hide();
  });
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="bdt-switcher-wrapper">
  <div id="bdt-tab-content-a49ef84" class="bdt-switcher bdt-switcher-item-content">
    <div content-id="tab-1" class="">
      <div></div>
    </div>
    <div content-id="tab-2" class="bdt-active">
      <div>I am tab #2 content</div>
    </div>
    <div content-id="tab-3" class="">
      <div> I am tab #3 content.</div>
    </div>
  </div>
</div>


推荐阅读