javascript - 如果 label = 空，则显示一个 div 并隐藏另一个 div

Question

如果标签为空(通知用户未找到互联网连接)，我已经能够有效地显示 div，这正是我想要的。

但是，如果标签为空，我还想隐藏#activateform。

根据我当前的设置，当函数运行时，即使填充了标签，#activateform 也会被隐藏，这不是我想要的。我尝试使用 if 语句(请参阅底部代码块)，但无法使其正常工作。

这是我的 html:

<div class="form-group" style="display:none">
   <label id="internet_ipaddr" for="internet_ipaddr" class="tbh"></label>
   <h4> You don't seem to be connected to the internet </h4>
</div>

<div id="activateform"> This has to be hidden if label = empty </div>

还有我的脚本:

$(document).ready(function(){
  setTimeout(function(){
    $("div.form-group label.tbh:empty").parent().show();
    $("#activateform").hide();
  },2000);
});

我尝试仅在 label = 空时才做到这一点:

$(document).ready(function(){
  setTimeout(function(){
  if $("div.form-group label.tbh").empty() {
    $("#activateform").hide();
  }
},2000);

Answer 1

您可以使用 .is() 的组合方法和:empty selector

setTimeout(function() {
  var elem = $("div.form-group label.tbh");
  if (elem.is(':empty')) {
    elem.parent().hide();
    $("#activateform").hide();
  } else {
    elem.parent().show();
  }
  //Rest of your code
}, 2000);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="form-group" style="display:none">
  <label id="internet_ipaddr" for="internet_ipaddr" class="tbh"></label>
  <h4> You don't seem to be connected to the internet </h4>
</div>